ajax.reload() not working with server side processing.

Foiaz

Hi,
Following is the initialization code

dtable = $('#trackerTable').DataTable({
        "processing": true,
        "serverSide": true,
        "retrieve": true,
        "order": [[1, "asc"]],
        "search": {search: ""},
        ajax: {
            url: url,
            type: "POST",
            dataType: "json",
            data: function (d) {
                d.fDate = fromDate;
                d.tDate = toDate;
            }
        },
        columns: [
                    { "data": "Id", "render": function (data) { return "<td><input type='checkbox' name='Tests' value='" + data + "' class='custom-checkbox chkCheckBoxId'></td>"; }, "orderable": false },
                    { "title": "TFS ID", "data": "TFSId" },
                    { "title": "State", "data": "StateName" },
                    { "data": "LOB" },
        ],
        lengthMenu: [[10, 25, 50, 100], [10, 25, 50, 100]],
        "rowCallback": function (row, data) {
            if (data.IsDisabled) {
                $(row).addClass('RecordDisbaled');
            }
        }
    });

Following is the code which call reload, after an record update with different ajax call and in it's success method.

$.ajax({
        url: url,
        data: {
            testIds: testIdList,
            state: stateId,
        },
        cache: false,
        type: "POST",
        success: function (data) {
'''
            dtable.ajax.reload(null, false);
'''
            setTimeout(function () {
                $("#getCode").html(data);
                $("#getCodeModal").modal('show');
            }, 1000);
        },
        error: function (reponse) {
            alert("error : " + reponse);
        }
    });

When using firebug to investigate the error, I am seeing the following request headers

draw: 2
columns: [object Object]
columns: [object Object]
columns: [object Object]
columns: [object Object]
order: [object Object]
start: 0
length: 10
search: [object Object]
fDate:
tDate:

Server responded with 500 and message as follows.

The value of the search cannot be null. If there's no search performed, provide an empty string.<br>Parameter name: value

can I get a help on this.

Thanks in advance.

colin

Hi @Foiaz ,

ajax.reload() would only be used if serverSide isn't - as it will send data for the whole table. For you, as serverSide is enabled - just call draw(), as this will get the data from the server.

Cheers,

Colin

Foiaz

Hi Colin, Thanks for your suggestion, but draw()API call as well results in the same issue.

I tried Allan's solution from https://datatables.net/forums/discussion/39130
Not sure, what I am missing here.

Cheers,
Foiaz

allan

Can you give us a link to the page please? I don't see anything wrong with the client-side code above, so I'd have to guess that there is something on the server-side going on, but I'd like to check what is being submitted to the server.

Allan

Foiaz

Hi Allan,

The site is an internal application in our organization, I could not share the link for it.
But, I still couldn't able to find what is causing the issue.

On ajax.reload(), the request headers passed for Columns, Search, and Order are not correct, which is causing the issue.

Do I need to use Json.Stringify for ajax post request ?

draw: 2
columns: [object Object]
columns: [object Object]
columns: [object Object]
columns: [object Object]
order: [object Object]
start: 0
length: 10
search: [object Object]
fDate:
tDate:

Thanks

colin

Hi @Foiaz ,

There's some odd going on there - that shouldn't be the case, see this example here.

The only thing I can think of is that you're using retrieve, which would use an earlier initialisation of the table if it exists. I'm wondering if that earlier initialisation doesn't have the same column definitions, and therefore causing this problem.

Cheers,

Colin