Multiple Tables - only initializes the first table selected.
Multiple Tables - only initializes the first table selected.
DanLouisGS
Posts: 1Questions: 1Answers: 0
I can't find where I'm going wrong.
I have 5 tables on the page all of which are correctly styled and placed. I can get the "show entries", search bar, and paging functionality ("elements") to work perfectly on the first table (that being the topmost table on the page where the selector is present). But the elements will not initialize on any of the other tables.
I've tested it out by changing the 'class' around and whichever table that has the correct class displays the element; if any other table has the same class, only the table that appears first on the page displays the elements.
I've placed the JQuery script, $(document).ready(function() script directly into the html - at the bottom of the page - and linked all of the required .js and css files via CDN.
What would cause it to only initialize once?
Answers
I have experimented with multiple tables and have the same problem as DanLouisGS. I have the following function (in the
<head>section):Later on, each of my tables uses
<table id="" class="display">, as in the example found at http://datatables.net/examples/basic_init/multiple_tables.html. As you can see on my site at http://www.mus.ulaval.ca/roberge/srs/datatables-test-multiple.htm, only the first of the three tables displays as expected using theclass="display"instruction. I cannot see where the problem is. I hope that this will help us arrive at a solution.I am having the same issue as you ma_roberge. I have set up my code exactly as they have it in their documentation (class="display", etc.) and only the first will initialize.
EDIT
my workaround was to manually add the dataTables class to my second table. Not sure if any functionality works on the second table since I am only showing data, but at least it gets the CSS and whatnot.