Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery Datatables - How to insert a div between the toolbar and the table?

How can I insert a div class="row" between the tool bar and the table itself? Where the arrow line is in the below image.

Thank you!

div row where the arrow line is

like image 771
D4A60N Avatar asked Aug 02 '16 22:08

D4A60N


People also ask

Can we use DataTable with Div?

DataTables places the main table and all of the various component display controls for the table inside a container element, a div element with a class of dataTables_wrapper (by default).

What is dom in jQuery DataTable?

Description. DataTables will add a number of elements around the table to both control the table and show additional information about it. The position of these elements on screen are controlled by a combination of their order in the document (DOM) and the CSS applied to the elements.

What is bDestroy in DataTable?

bDestroy. Show details. Replace a DataTable which matches the given selector and replace it with one which has the properties of the new initialisation object passed. If no table matches the selector, then the new DataTable will be constructed as per normal.

What is stateSave in DataTables?

When DataTables' state saving option is enabled ( stateSave ) KeyTable will automatically store the last cell focused in a table and then restore that state when the page is reloaded.


1 Answers

I reckon you can accomplish this using the JQuery insertAfter method. http://api.jquery.com/insertafter/

First, use a selector for your toolbar and then use the function insertAfter after that.

Sample Html:

<div id="toolbar" > Your stuff here </div>

<table id="yourTable">...</table>

Sample Jquery code:

$("#toolbar").insertAfter("<div class='row'></div>");
like image 91
Dinglemeyer NeverGonnaGiveUUp Avatar answered Sep 16 '22 14:09

Dinglemeyer NeverGonnaGiveUUp