Ajax data source not refreshing - stuck on "Processing"

RossWHolland

I have the following definition:

$(document).ready(function () {
    $('#AlertTable').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "getJSONData.php?0=BookingAlert&1="+document.getElementById("NumDraws").value,
        "drawCallback": function( settings ) {
            document.getElementById("NumDraws").value++;
        },
        columns: [
            { data: "AlertID" },
            { data: "CodeDesc" },
            { data: "AlertNotes" },
            { data: "FullName" },
            { data: "Sent",
                render: function (data, type, row) {
                    if (data === "1") {
                        return '<input type="checkbox" checked disabled>';
                    }
                    return '<input type="checkbox" disabled>';
                }
            }
        ],
        paging: true,
        searching: false,
        ordering:  false,
        lengthChange: false,
        select: true,
        "info": true,
        "columnDefs": [{
                "targets": [ 0 ],
                "visible": false,
                "searchable": false
            }
        ]
    })
    // Hide the containing element if there are no outstanding alerts
    if (document.getElementById("NumAlerts").value === "0") {
        document.getElementById("AlertGrid").style.display="none";
        document.getElementById("AlertIcon").title="View Alerts";
    }
});

The element NumDraws is to keep a counter of the number of Draws, which it seems to do successfully (although I suspect there is a better way though I can't find it). The PHP page returns JSON data with this value as the "draw" value.

I also have this function

function clearAlerts() {
    var AlertTable = $('#AlertTable').DataTable();
    var count = AlertTable.rows( { selected: true } ).count();
    if (count == 0) {
        showAlert("Please select at least 1 Alert","Warning");
        return false;
    }
    var clearAlerts = confirm('Are you sure you want to clear the selected alerts?');
    if (clearAlerts) {
        for(var i=0;i<AlertTable.rows( { selected: true } ).count();i++)
        {
            var rows = AlertTable.rows( i ).data();
            url = "clearAlert.php?0="+rows[i].AlertID;
            $.ajax({
                type: "POST",
                url: url
            });
        }
// THIS IS THE LINE WHICH APPEARS NOT TO WORK?
        AlertTable.ajax.reload(null, true);
    }
}

This works inasmuch as it changes the value in the database, however the DataTable then just says "Processing" and is not refreshed. I have again searched for hours in the forum and elsewhere for the answer to this, and although there are many answers, all of them I can find seem to have a completely different way of getting the data in the first place. The initial draw works fine.

Any assistance greatly appreciated. If I can crack this I can utilise DataTables across my site !

Cheers

Ross

kthorngren

I'm not sure about the method you are using for numDraws and the draw parameter. Someone else may comment on that. I would start by looking at the request and response from your browser's network tools. Steps can be found in this tech note:
https://datatables.net/manual/tech-notes/1

What is the response?

Kevin

RossWHolland

Hi Kevin,

Great advice using the tools there. It turns out that it will not refresh the parameter passed, so the draw count always came back as 1, however it automatically passed "draw" as a parameter, which I could see from the tool, and when I modified to return THAT value, it worked! Thanks for your help.