Trigger Ajax Load using table.setData()

[ghost]

I apologize if this is not a bug but just my misunderstanding but I posted on SO and haven't found a solution. I have a tabulator version 4.2 table using ajaxURL and headerFilter and it works fine. The default functionality is for tabulator to make an ajax call on every change but I'm catching the ajaxRequest and returning false so that the user can enter several header fields and click a button to make the ajax call all in one shot. I'm just not sure how to trigger the ajax call on button click?

The docs say that:

If you have already set the URL using the ajaxURL option in the table constructor then you can trigger a reload of the data at any point by calling the setData function without any arguments. table.setData();

but I just get a Uncaught (in promise) error.

[tentus]

Can you link to your SO post and/or post a jsfiddle illustrating your issue?

[ghost]

My apologies again but the data is proprietary and sits behind a subscription based portal so I can't connect to the server with an example. However, the example code below works fine as far as getting data, the only issue I'm having is firing the table.setData(); once a client button fires the set_apply_filter() function.

var apply_filter = 0; function set_apply_filter() { if ( table.getHeaderFilters().length ) { apply_filter = 1; } }

function render_table() { table = new Tabulator("#example-table", { ajaxURL: "data.php", ajaxParams: {'aoi': '1'}, ajaxFiltering:true, pagination: "local", paginationSize: 500, height: 500, columns:[ {title:"Classification", field:"Classification", headerFilter:"input", headerFilterPlaceholder:"search...", width:126}, {title:"County", field:"County", headerFilter:"input", headerFilterPlaceholder:"search...", width:124}, {title:"SEC", field:"SEC", headerFilter:"input", headerFilterPlaceholder:"##", width:64}, {title:"TWN", field:"TWN", headerFilter:"input", headerFilterPlaceholder:"##", width:67}, {title:"RNG", field:"RNG", headerFilter:"input", headerFilterPlaceholder:"##", width:66}, ], ajaxRequesting:function(url, params){ if ( apply_filter ) { apply_filter = 0; table.setData(); } else { return false; } }, ajaxResponse:function(url, params, response){ return response.data; }, ajaxError:function(xhr, textStatus, errorThrown){ console.log(xhr); console.log(textStatus); console.log(errorThrown); }, }); }

[ghost]

Let me rephrase my question. Is there a way to hold up the ajax request so that it doesn't fire on every change but rather once a flag is set, ie., on button click?

[olifolkerd]

Hey @ronbanks

This is more of a general JavaScript question as it is not referring to and specific Tabulator functionality, but to how to generically delay a function call.

Please ask this on Stack Overflow, this issues list is reserved for Tabulator bugs and feature requests.

As a pointer, you want to look at using setTimeout and clearTimeout to manage a delayed call to the function.

Cheers

Oli :)