function reference html data-* attribute

sebascomeau

Is there a way to put a function reference in the table html data-* attribute?

<script>

const my_stateLoadCallback = function(settings) {
    try {
        return JSON.parse(sessionStorage.getItem('DataTablesIdentifier'));
    } catch (e) {
        return {};
    }
}

const my_stateSaveCallback = function (settings, data) {
    try {
        sessionStorage.setItem('DataTablesIdentifier', JSON.stringify(data));
    } catch (e) { }
}

</script>

<table class='table table-bordered table-striped'
data-state-save="true"
data-state-load-callback="my_stateLoadCallback"
data-state-save-callback="my_stateSaveCallback"
>
...
</table>

sebascomeau

I always receives: TypeError: b.fnStateLoadCallback.call is not a function

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

allan

data-state-load-callback="my_stateLoadCallback"

This won't work I'm afraid. You cannot use HTML5 attributes to define functions for Javascript. DataTables will just see the state save callback function as a string and will not resolve that into a global function.

If you want to define callbacks you need to use the Javascript initialisation parameters.

Allan