Delay search function when using server-side processing

Tsun4mi

Hello Allan,

i'm wondering if there's already an option for this or if this was already discussed but i've found nothing yet, so:

i'm using datatables with a large mysql database behind (and i really love it by the way :),
but what really bothers me is the behaviour of the search/filter-option in this case.
Every time the user enters a single letter into the searchbox, it is instantly queried to the database, so if i enter a word consisting of 6 letters, 6 sql-queries are made and it takes quiet long to get the result.

Is there any way to delay this process, so that maybe a second or so has to go by till the script is started?

Thanks for your help and greetings from germany,
Bernd

allan

Hi Bernd,

Have a look at this API plug-in which does exactly what you are looking for: http://datatables.net/plug-ins/api#fnSetFilteringDelay

Allan

Tsun4mi

Hi Allan,

thanks for your quick response.
You're right, this looks like exactly what i was searching for.

Unfortunately, i can't get the plug-in working! :(
I've implemented it just the way it was described. After that i initialize the table object and calling the new function:

[code]
oTable = $("#div_selector").find("#table").dataTable( {
"bAutoWidth": false,
"bProcessing": true,
"bServerSide": true,
"aaSorting": [[3,'desc']],
"fnDrawCallback": function() { AjaxLoader(); AdditionalLinks(); },
"sAjaxSource": "serverside-processing.php",
"fnServerData": function ( sSource, aoData, fnCallback ) {
aoData.push( { "name": "id", "value": "<?=$id;?>"});
aoData.push( { "name": "time", "value": "<?=$time;?>"});
aoData.push( { "name": "seid", "value": seid });
$.getJSON( sSource, aoData, function (json) { fnCallback(json) } );
},
"oLanguage":
{
"sUrl": "javascripts/jquery.dataTables.ger.txt"
}

});
oTable.dataTable().fnSetFilteringDelay(10000);
[/code]

Can you see any mistake within the code snippet?

Thanks very much in advance,
Bernd

allan

Change this line:

[code]
oTable.dataTable().fnSetFilteringDelay(10000);
[/code]
to

[code]
oTable.fnSetFilteringDelay(10000);
[/code]
And it should do the job.

Allan

Tsun4mi

It still doesnt work. :(

I've tried a variety of things meanwhile - testing it on different tables, tables with ssp and without... it still filters immediately as i type something.

I know your possibilities of helping here are restricted... are you absolutely sure the plug-in-code is working. Unfortunately there are so many unknown variables in the code so i'm not able to understand it fully.

Can you think of any other way i could have messed it up? ;-)

allan

Yes the plug-in most certainly works.

Can you post your full initialisation code please? Including where you have the plug-in included.

Allan

pilou

please try not use oLanguage, if I used, the the optionplugion not worked

"oLanguage":
{
"sUrl": "javascripts/jquery.dataTables.ger.txt"
}

namo

works perfectly for me, thx guys.

grizzlynetch

there is a way to display even with oLanguage settings. This is caused due to "ensuring" initialisation in source code:

[code]
/* Ensure that the table data is fully initialised */
if ( oSettings.bInitialised === false )
{
setTimeout( function(){ _fnInitialise( oSettings ); }, 200 );
return;
}
[/code]

The fix for me is delaying the fnSetFilteringDelay function call like this:

[code]setTimeout( function(){table.fnSetFilteringDelay(...); }, 500 );[/code]

allan

Yes - when you specify sUrl for the language, you enter an async "mode" since the Ajax request to get the data must occur before the filtering element can be drawn (with the correct language information). A setTimeout will work most of the time - but if your network delay for the language files in >500mS then you run in to the same issue. The way to cope with this is to add the filtering delay using the fnInitComplete callback function.

Allan

cesarvinas

allan, can you please explain how? Can you include a complete example of how to do this?

bidon2

I need that information too. The plugins don't work with oLanguage defined... =(

allan

PLease link to a test case showing the issue: http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read

Allan

coder_stu

Hi Allan,

After having difficulty getting the fnSetFilteringDelay plugin to work, I found that DataTables v1.9.4 sets a binding on the search input element like this:
[code]jqFilter.bind( 'keyup.DT', function(e) {[/code]
but the plugin unbinds 'keyup', not 'keyup.DT', so the default filtering was occurring regardless.

After changing the plugin to unbind the correct event, like so:
[code]anControl.unbind( 'keyup.DT' ).bind( 'keyup', function() {[/code]
it works perfectly.

Perhaps the bound event has changed in a more recent version of DataTables, but I think the plugin needs to updated.

Cheers,
Mark.

TimNZ

Great, thanks to Allan for the plugin and the fixes.
Easy enough to add an option for minimum length of search string before doing the filter too.