To avoid overloading your server, you need to query the data only when you've actually finished typing.
The DataTables
plugin itself can be extended with further plugins, one of which is called fnSetFilteringDelay
, created by Zygimantas Berziunas, which delays the sending of the query until after you've stopped typing.
To include it, simply copy and paste from the DataTables
plugins page into your tables.html
page, above the $(document).ready
section, and then activate it by chaining it to your dataTable
call.
Here is the JavaScript in full, with comments removed from the fnSetFilteringDelay
plugin for readability (the license for the plugin is GPL2 or BSD3.x):
jQuery.fn.dataTableExt.oApi.fnSetFilteringDelay = function ( oSettings, iDelay ) { iDelay = (iDelay && (/^[0-9]+$/.test(iDelay))) ? iDelay : 250; var $this = this, oTimerId; var anControl = $( 'div.dataTables_filter input:text' ); anControl.unbind( 'keyup' ).bind( 'keyup', function()...