Quantcast
Viewing all articles
Browse latest Browse all 82129

One external form for multiple datables

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 :
$(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&eacute;e</td>
		<td align="center" id="dateFilter"></td>
	</tr>
	<tr id="filter_col2">
		<td align="center">Heure d'entr&eacute;e</td>
		<td align="center" id="heureFilter"></td>
	</tr>
	<tr id="filter_col4">
		<td align="center">D&eacute;ch&egrave;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&eacute;e</th>
		<th>Heure d'entr&eacute;e</th>
		<th>D&eacute;ch&egrave;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&eacute;e</th>
		<th>Heure d'entr&eacute;e</th>
		<th>D&eacute;ch&egrave;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 ?

Viewing all articles
Browse latest Browse all 82129

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>