Hi everybody.
I use Column Filter in an external form (like this example : http://jquery-datatables-column-filter.googlecode.com/svn/trunk/external.html). I have multiple tables on the same page, with the same name in columns, but with a different row grouping (group by name, group by day, etc).
My external form filter work on the first table only for the moment, but i want filtering all tables with just one filter.
How can I do it ?
Code js :
Code Html :
Someone can help me please ?
I use Column Filter in an external form (like this example : http://jquery-datatables-column-filter.googlecode.com/svn/trunk/external.html). I have multiple tables on the same page, with the same name in columns, but with a different row grouping (group by name, group by day, etc).
My external form filter work on the first table only for the moment, but i want filtering all tables with just one filter.
How can I do it ?
Code js :
$(document).ready(function (){ var oTableDetail = $('#tabDetail').dataTable(); var oTableStatsUser = $('#tabStatsUser').dataTable(); $("#tabDetail").dataTable().columnFilter({aoColumns:[ { type:"input", sSelector: "#usagerFilter" }, { type: "date-range", sSelector: "#dateFilter" }, { type:"select", sSelector: "#heureFilter" }, { type:"select", sSelector: "#decheterieFilter" } ]}
Code Html :
<table class="tabStatsFiltre" id="tabFilter"> <thead> <tr><th colspan="2">Filtres sur tableau</th></tr> </thead> <tbody> <tr id="filter_global"> <td align="center">Usager</td> <td align="center" id="usagerFilter"></td> </tr> <tr id="filter_col1"> <td align="center">Date d'entrée</td> <td align="center" id="dateFilter"></td> </tr> <tr id="filter_col2"> <td align="center">Heure d'entrée</td> <td align="center" id="heureFilter"></td> </tr> <tr id="filter_col4"> <td align="center">Déchèterie</td> <td align="center" id="decheterieFilter"></td> </tr> </tbody> </table> <br /> <div id="contenu"> <table class="tabStats" id="tabDetail'"> <thead> <tr> <th>Usager</th> <th>Date d'entrée</th> <th>Heure d'entrée</th> <th>Déchèterie</th> <th>Commune</th> <th>Statut</th> </tr> </thead> <tbody> ALL MY DATA </tbody> <tfoot> <tr> <th></th> <th></th> <th></th> <th></th> <th></th> <th></th> </tr> </tfoot> </table> <br /> <table class="tabStats" id="tabStatsUser'"> <thead> <tr> <th>Usager</th> <th>Date d'entrée</th> <th>Heure d'entrée</th> <th>Déchèterie</th> <th>Commune</th> <th>Statut</th> </tr> </thead> <tbody> ALL MY DATA </tbody> <tfoot> <tr> <th></th> <th></th> <th></th> <th></th> <th></th> <th></th> </tr> </tfoot> </table> </div>
Someone can help me please ?