stateSaveCallback fires every reload

stateSaveCallback fires every reload

orhangilmourorhangilmour Posts: 3Questions: 2Answers: 0

Good day to everyone,

First of all we are very much in love with that plug-in. In our case, we are creating both html and js code in run-time. Datatables renders very well with no problem at all. But after datatables rendered, stateLoadCallback requests last state of datatable as expected but stateSaveCallback fires also even there's no chance at all. Is there any mistake in our code?

In js file;

var jobOrderJsonTable = $('#serviceIndex').on('init.dt', function (e, settings, json, xhr) {
        var subcomp = json.isAdmin;
        if (json.isAdmin == "0") {
            var dt = $('#serviceIndex').DataTable();
            dt.column(11).visible(false);
        }

    }).dataTable({
        "bServerSide": true,
        "sAjaxDataProp": "data",
        "sAjaxSource": "/Service/GetIndex",
        "bProcessing": true,
        "stateDuration": 60*60*24*365,
        stateSave: true,
        "stateSaveCallback": function (settings, data) {$.ajax( {"url": "/state_save","data":{"data": JSON.stringify(data),"tableID":"1"},"dataType": "json","type": "POST","success": function () {}} );},
        stateLoadCallback: function (settings, callback) {$.ajax( {url: '/fetch_state',"data":{"tableID":"1"},dataType: 'json',success: function (json) {callback(JSON.parse(json));}} )},
        "autoWidth": true,
         "ordering": false,
          "scrollX": true,
          "scrollY": 600,
         "order": [],
        "dom": 'ZlBfrtip',
        "deferRender": true,
        colReorder: true,
        searchDelay: 1000,
        "lengthMenu": [[100, 1001], [100, "Hepsi"]],
        "fnServerData": function (sSource, aoData, fnCallback, oSettings) {
            aoData.push({
                "name": "filter", "value": function () {
                    if (jQuery.isEmptyObject(getUrlVars()["filter"]))
                        return '';

                    return getUrlVars()["filter"];
                }
            });
            aoData.push({
                "name": "state", "value": function () {
                    if (jQuery.isEmptyObject(getUrlVars()["state"]))
                        return '';

                    return getUrlVars()["state"];
                }
            });
            oSettings.jqXHR = $.ajax({
                "dataType": 'json',
                "type": "POST",
                "url": sSource,
                "data": aoData,
                "success": fnCallback
            });
        },
        buttons: [
            //buttons code
        ],
    //columns code 

]
});

Thanks in advance for your kind responses.

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Hi @orhangilmour ,

    Yep, that's what it does - it's because the stateLoadCallback changes (or may change) the state of the table, it then calls stateSaveCallback to store those changes.

    If you want to avoid that first save, you could perhaps have a flag, initially set to 0, and on that first save flip it's value which would start saves on the second iteration. Not ideal, but not a bad workaround still,

    Cheers,

    Colin

  • orhangilmourorhangilmour Posts: 3Questions: 2Answers: 0

    @colin, first of all thank you for your response. The actual problem is, everytime saveStateCallback works, it sends default of the table, not storing the changes that user made already. I guess the problem is either loading the previously saved state of table or saving the altered state of table.

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Hi @orhangilmour ,

    That does sound odd. Take a look at this example, you can see in the console that the data being sent does reflect the current state. Could you modify that example so it reflects yours problem, it would be good to get to the bottom of it,

    Cheers,

    Colin

This discussion has been closed.