Reputation: 89
I have 2 datatables on a webpage, and they are being instantiated with a single selector:
var myTable = $('.dataTable').DataTable();
I want to then use the "search" function on both of these tables for the same value at the same time.
The problem is that doing this only does the search operation on the second table.
jsfiddle: https://jsfiddle.net/a2afkn4a/
The DataTables documentation seems to be quite clear on this, saying that multiple tables can be initialized and manipulated together using a single selector: https://datatables.net/examples/basic_init/multiple_tables.html
How do I apply this search to both tables with one selector?
Note: I understand that I can "easily" separate the tables and operate on them independently. The problem is that the table creation is done in a library that many other webpages use, so making 2 independent tables with different ids will take a lot of work to ensure that it's still working across all pages using the library.
Any input would be appreciated.
Upvotes: 0
Views: 79
Reputation: 23389
You're right, the DT docs are indeed, quite clear...
The tables are independent for user control (i.e. user controlled paging on one table does not effect the others), but they do share the initialisation parameters given (for example if you specific the Spanish language file, all tables will be shown in Spanish).
jQuery objects represent a group of elements, the DT object does not. You can init them at the same time but that doesn't mean the DT object is going to hold more than one table.
You'll need to do them separately.
var opts = {
"sPaginationType": "full_numbers",
data: dataSet,
columns: columnDefs,
};
$('.dataTable').each(function(){
$(this).DataTable(opts).column(0).search('Airi').draw();
});
Here's the updated fiddle.
Upvotes: 1