Valid for v2 and v3, buttonAPI stop working when DatatTable defaults are set with language url

BjornHa

Testcase: https://live.datatables.net/licetamu/1/edit

If the syntax

"language": {
        "url": '//cdn.datatables.net/plug-ins/3.0.2/i18n/sv-SE.json'
}

is used this code

searchAppTable.button().add(null, {
    action: function (e, dt, button, config) {
        dt.ajax.reload();
    },
    text: 'Reload table'
});

returns this error:

"TypeError: Cannot read properties of undefined (reading 'map')
at B.instanceSelector (https://cdn.datatables.net/v/dt/jszip-3.10.1/dt-3.0.2/b-4.0.2/cv-1.0.2/date-2.0.0/e-3.0.1/fc-6.0.0/kt-3.0.0/rg-2.0.0/sc-3.0.0/sb-2.0.0/sl-4.0.1/datatables.min.js:40:49241)
at ApiButton.<anonymous> (https://cdn.datatables.net/v/dt/jszip-3.10.1/dt-3.0.2/b-4.0.2/cv-1.0.2/date-2.0.0/e-3.0.1/fc-6.0.0/kt-3.0.0/rg-2.0.0/sc-3.0.0/sb-2.0.0/sl-4.0.1/datatables.min.js:40:54889)
at ApiButton.r [as add] (https://cdn.datatables.net/v/dt/jszip-3.10.1/dt-3.0.2/b-4.0.2/cv-1.0.2/date-2.0.0/e-3.0.1/fc-6.0.0/kt-3.0.0/rg-2.0.0/sc-3.0.0/sb-2.0.0/sl-4.0.1/datatables.min.js:30:75341)
at <anonymous>:390:25
at https://live.datatables.net/js/prod/runner-3.17.11.min.js:1:13478
at https://live.datatables.net/js/prod/runner-3.17.11.min.js:1:10543"

However if the content of the file (excluding the {} that are surrounding the settings, the error goes away.
Both the url and content are in the test case, just uncomment the part you want to test.

The case is set with version 3, but can be switched to version 2 by change which lines in the HTML to uncomment
(v2 contains bs5 so looks crap but shows same error)

KR,
Bjørn Hasselberg

allan

Hi Bjørn,

Many thanks for letting me know about this. The immediate fix is to use ready() to make sure that the DataTable is loaded before adding the button: https://live.datatables.net/licetamu/2/edit .

The issue is that the language.url option makes the table loading async. So the browser goes off to load the language file, but continues on executing your code. Where this becomes an issue is that Buttons doesn't initialise itself until after the language file has loaded (buttons might need to use the language strings!).

I need to have a little bit of a think about how it might be possible to resolve this, while still allowing buttons to use language strings - I'm not sure that the two can be done. For the moment, use ready() to wrap around your extra button.

Regards,
Allan

BjornHa

Works like a charm many thanks Allan.
It should be a sufficient pattern to adhere to...
Will drop some more DataTables things on you as we look inte DT 3...