A Filter Question
A Filter Question
UnkleFrank
Posts: 5Questions: 0Answers: 0
Hi all
New to Datatables and my first post.
I've searched the forums and have not been able to find a simple solution. I need to add a text field input or drop down list to filter my cities by the state they are in. Can anyone direct me to an example?
Thanks.
Frank
New to Datatables and my first post.
I've searched the forums and have not been able to find a simple solution. I need to add a text field input or drop down list to filter my cities by the state they are in. Can anyone direct me to an example?
Thanks.
Frank
This discussion has been closed.
Replies
Here is my existing code. Can anyone steer me in the right direction?
Thanks,
[code]
$(document).ready(function() {
$('#the_table').dataTable( {
"bProcessing": true,
'bServerSide':true,
"sAjaxSource": "conn3.php",
"aLengthMenu": [10, 25, 50, 100],
"sPaginationType": "full_numbers",
"fnServerData": function ( sSource, aoData, fnCallback )
{
aoData.push( { "state": "extra_filter", "value": $('#state_filter').val() } );
$.getJSON( sSource, aoData, function (json) {
fnCallback(json)
} );
}
} );
$('#state_filter').keyup( function () {
oTable.fnDraw();
} );
} );
[/code]
It is worth noting that since you are using server-side processing, its the server that does the filtering, so you need to make sure that the server-side script is capable of doing column filtering.
Allan
<?php
/*
* Script: DataTables server-side script for PHP and MySQL
* Copyright: 2010 - Allan Jardine, 2012 - Chris Wright
* License: GPL v2 or BSD (3-point)
*/
Does the code you reference above replace mine or go along with it.
Sorry, brand new to this.
Frank
if you look at allan's URL re: mult_filter.html, you'll his keyup() event like this :
$("tfoot input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );
I think you need to remove fnDraw() and instead use Allan's oTable.fnFilter() function.
If you "view source" here - http://datatables.net/release-datatables/examples/api/multi_filter.html - then you'll see how he sets up "tfoot" below his html table...and maybe you'll get some ideas studying this code.
I'm certainly struggling too, so I feel your pain.
good luck.
Bob
I tried your suggestion with no success...
I'm trying to add a simple filter below, above, externally, any way I can but having no success with this. Is it because it's not possible when using server-side scripts? I'm just trying to filter by state and then city.
Here's the latest:
[code]
$(document).ready( function() {
$('#tableId').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "conn3.php",
"fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
oSettings.jqXHR = $.ajax( {
"dataType": 'json',
"type": "GET",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
}
}
).columnFilter({
aoColumns: [ { sSelector: "#bus_name" },
{ sSelector: "#street" },
{ sSelector: "#city" },
{ sSelector: "#state" },
{ sSelector: "#zip" },
{ sSelector: "#tele" }
]
});
} );
[/code]