error on inline editor select2 dropdown after ajax.reload()

itram

I have a datatable (with editor) which I need to update from time to time to reflect the changes done in the server side by other instances.
This datatable has inline edition enabled and some fields have a select2 dropdown to choose from the options.
The problem is that when I do myTable.ajax.reload(); then I get this error :

select2.min.js:2 Uncaught TypeError: Cannot read properties of undefined (reading 'isConnected')
at e._positionDropdown (select2.min.js:2:49212)
at o._positionDropdown (select2.min.js:2:4404)

and select2 is not working anymore.
Without myTable.ajax.reload(); the select2 works fine.
How to refresh data and keep select2 working?

allan

Is that with the Select2 field visible? Or does it just happen at any time? Can you give me a link to the page in question so I can debug it please?

Many thanks,
Allan

itram

I concluded by disabling the Select2 functionality when triggering the reload loop and then re-enabling it once the loop completes. I'm unsure if there's a more straightforward method for accomplishing this.

´´´
function setupDataTableRefresh() {
$('.form-select').select2('destroy');
var refreshIntervalId = setInterval(function () {
playersTable.ajax.reload(null, false);
}, 5000);
return function stopRefreshInterval() {
clearInterval(refreshIntervalId);
$('.form-select').select2({
minimumResultsForSearch: Infinity
});
};
}
´´´

allan

Hi,

That's a nice solution - thanks for sharing with us.

Allan