Filter Delay (fnSetFilteringDelay) - Can it work with multiple tables?
Filter Delay (fnSetFilteringDelay) - Can it work with multiple tables?
[Filter Delay (fnSetFilteringDelay) - custom API function - http://datatables.net/plug-ins#api]
I have 3 instances of DataTables on a page, each contained within a jQuery UI tab. The tables have different AJAX sources and setups (e.g., one table can be edited, one has different editable fields and one is view only). Each datatables instance is initialized separately (oTable, oTable2 and oTable3).
Is there a way to make the filter delay work for multiple tables?
Following is the code I've tried and associated results:
[code]
/* DataTables - Global Search Filter Delay */
// Method 1
oTable.fnSetFilteringDelay(1000); // Table 1
oTable2.fnSetFilteringDelay(1000); // Table 2
oTable3.fnSetFilteringDelay(1000); // Table 3
// Method 2 (Chaining)
.fnSetFilteringDelay(1000);
//$('#wip_grid_0').dataTable( [SETTINGS] ).fnSetFilteringDelay(1000);
[/code]
Without the filter delay code, the search function works as expected on all tables.
When the filter delay code is added to the script, but not associated with a table, none of the filters work.
When the method 1 filter delay is associated with the first table instance, it works as expected and the other table filters don't work.
When the method 1 filter delay is associated with subsequent table instances (with a single or multiple tables),the processing notice is displayed for the associated table, but the actual filtering does not occur (for any table).
When the method 2 filter delay is associated with the first table instance, it works as expected and the other table filters function without the delay.
When the method 2 filter delay is associated with subsequent table instances (with a single or multiple tables),the processing notice is displayed for the associated table, but the actual filtering does not occur (for any table).
I have 3 instances of DataTables on a page, each contained within a jQuery UI tab. The tables have different AJAX sources and setups (e.g., one table can be edited, one has different editable fields and one is view only). Each datatables instance is initialized separately (oTable, oTable2 and oTable3).
Is there a way to make the filter delay work for multiple tables?
Following is the code I've tried and associated results:
[code]
/* DataTables - Global Search Filter Delay */
// Method 1
oTable.fnSetFilteringDelay(1000); // Table 1
oTable2.fnSetFilteringDelay(1000); // Table 2
oTable3.fnSetFilteringDelay(1000); // Table 3
// Method 2 (Chaining)
.fnSetFilteringDelay(1000);
//$('#wip_grid_0').dataTable( [SETTINGS] ).fnSetFilteringDelay(1000);
[/code]
Without the filter delay code, the search function works as expected on all tables.
When the filter delay code is added to the script, but not associated with a table, none of the filters work.
When the method 1 filter delay is associated with the first table instance, it works as expected and the other table filters don't work.
When the method 1 filter delay is associated with subsequent table instances (with a single or multiple tables),the processing notice is displayed for the associated table, but the actual filtering does not occur (for any table).
When the method 2 filter delay is associated with the first table instance, it works as expected and the other table filters function without the delay.
When the method 2 filter delay is associated with subsequent table instances (with a single or multiple tables),the processing notice is displayed for the associated table, but the actual filtering does not occur (for any table).
This discussion has been closed.
Replies
It is possible to do what you are looking for, it just needs a bit of re-jigging of the fnSetFilteringDelay() to support chaining. I've have a little play around with this and come up with what is below. It should match what you are looking for.
[code]
jQuery.fn.dataTableExt.oApi.fnSetFilteringDelay = function ( oSettings, iDelay ) {
var _that = this;
this.each( function ( i ) {
$.fn.dataTableExt.iApiIndex = i;
iDelay = (iDelay && (/^[0-9]+$/.test(iDelay))) ? iDelay : 250;
var $this = this, oTimerId;
var anControl = $( 'input', _that.fnSettings().anFeatures.f );
anControl.unbind( 'keyup' ).bind( 'keyup', function() {
var $$this = $this;
window.clearTimeout(oTimerId);
oTimerId = window.setTimeout(function() {
$.fn.dataTableExt.iApiIndex = i;
_that.fnFilter( anControl.val() );
}, iDelay);
});
return this;
} );
return this;
}
$(document).ready(function() {
$('.dataTable').dataTable().fnSetFilteringDelay();
} );
[/code]
Regards,
Allan
Thanks so much for this bit of re-jigging... It works great! I see that you used the "API instance setting" (iApiIndex), which I've seen in other posts addressing issues with multiple tables, but didn't think to incorporate here. Perhaps the plug-in should be updated to reflect this change (with Zygimantas' blessing?)? On a side note, the following line of code is inspirational:
[code]
var _that = this;
[/code]
Thanks again for your help and this wonderful plug-in!
Rob
Excellent - great to hear it works. Yes I think it might be a good idea to update the plug-in code to match what I've put in here. It will work both for the original case, and this 'new' chaining case you have pointed out. I'm rather liking the iApiIndex option :-). I'll make a note to do this once 1.5 goes final, rather than requiring people run beta code.
Regarding the _that = this - love that :-). Sometimes jQuery scoping can be very useful, sometimes very annoying - that's the best of both worlds...
Regards,
Allan