Using fnMultiFilter Plugin
Using fnMultiFilter Plugin
Hi,
I am just starting to use the datatables API for a new piece of work and I wanted to use multi column searching. I have ripped off the examples just to get me started and I cannot get the fnMultiFilter to work, the code I am using is exactly what is on the example page but it does not pass any parameters back to my servlet.
Here is my function taken from the example:
[code]
$.fn.dataTableExt.oApi.fnMultiFilter = function( oSettings, oData ) {
for ( var key in oData ) {
if ( oData.hasOwnProperty(key) ) {
for ( var i=0, iLen=oSettings.aoColumns.length ; i
I am just starting to use the datatables API for a new piece of work and I wanted to use multi column searching. I have ripped off the examples just to get me started and I cannot get the fnMultiFilter to work, the code I am using is exactly what is on the example page but it does not pass any parameters back to my servlet.
Here is my function taken from the example:
[code]
$.fn.dataTableExt.oApi.fnMultiFilter = function( oSettings, oData ) {
for ( var key in oData ) {
if ( oData.hasOwnProperty(key) ) {
for ( var i=0, iLen=oSettings.aoColumns.length ; i
This discussion has been closed.
Replies
[code]
<!DOCTYPE HTML>
@import "http://datatables.net/release-datatables/media/css/demo_page.css";
@import "http://datatables.net/release-datatables/media/css/demo_table.css";
var asInitVals = new Array();
var oTable;
$.fn.dataTableExt.oApi.fnMultiFilter = function( oSettings, oData ) {
for ( var key in oData ) {
if ( oData.hasOwnProperty(key) ) {
for (var i = 0, iLen = oSettings.aoColumns.length; i < iLen ; i++) {
if( oSettings.aoColumns[i].sName == key ) {
/* Add single column filter */
oSettings.aoPreSearchCols[ i ].sSearch = oData[key];
console.log(oData[key]);
break;
}
}
}
}
console.log(oSettings);
this.oApi._fnReDraw( oSettings );
};
$(document).ready(function() {
oTable = $('#example').dataTable( {
"bProcessing": true,
"sAjaxSource": './servlet/DataTables',
"bServerSide": true,
"sServerMethod": "POST",
"bFilter": false, //hide the search box
"aoColumns": [
{ "sName": "engine" },
{ "sName": "browser" },
{ "sName": "platform" },
{ "sName": "version" },
{ "sName": "grade" }
]
} );
$("thead input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnMultiFilter( { "engine": "Gecko", "browser": "Firefox", "platform": "Win" } );
} );
/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes in
* the footer
*/
$("thead input").each( function (i) {
asInitVals[i] = this.value;
} );
$("thead input").focus( function () {
if ( this.className == "search_init" ) {
this.className = "";
this.value = "";
}
} );
$("thead input").blur( function (i) {
if ( this.value == "" ) {
this.className = "search_init";
this.value = asInitVals[$("thead input").index(this)];
}
});
});
Rendering engine
Browser
Platform(s)
Engine version
CSS grade
[/code]
http://live.datatables.net/erokol/2
> "bFilter": false, //hide the search box
Oops - that disabled the filtering entirely :-).
If you want to keep filtering enabled, but hide just the search box, use the sDom option and remove the `f` . Other than that - it should work (does when I try it here: http://live.datatables.net/erokol/3/edit#preview ).
Allan
had been using multiple forum posts and examples to try to build a mock up of the table I want to use in production!
I had no idea that disabling that option would equal no filtering at all but its actually kind of obvious!!
Cheers for the help, I will now look to remove the search field as per your suggestion.
Paul