javascript - Datatables refresh with draw(), ajax, pagination - Stack Overflow

I'm trying to refresh my table with data from the server every few seconds. It's loading the new data but the pagination is not working at all. By that I mean, it's one big list of the data. It's also saying Showing 0 to 0 of 0 entries (filtered from NaN total entries) for the pagination at the bottom of the table.

I am using draw(false) in a setInterval function to achieve the refresh. I wanted to do this without using "serverSide":"true" but I found that draw() doesn't call the ajax url unless I use the serverSide option.

function myFunction() { 
var table1 = $("#example1").dataTable({
    "ajax": '/api/GetData',
    "serverSide": "true",
    "columns": [
        {
            "data": "DateCreated",                
        },
        { "data": "UserName" }
    ],
    "destroy": true
});

setInterval(function test() {        
    table1.draw(false);
}, 3000);
}

When I omit "serverSide":"true" the table is drawn correctly with the pagination but the ajax is not called with draw(). How can I get the ajax data and have the pagination set correctly?

I'm trying to refresh my table with data from the server every few seconds. It's loading the new data but the pagination is not working at all. By that I mean, it's one big list of the data. It's also saying Showing 0 to 0 of 0 entries (filtered from NaN total entries) for the pagination at the bottom of the table.

I am using draw(false) in a setInterval function to achieve the refresh. I wanted to do this without using "serverSide":"true" but I found that draw() doesn't call the ajax url unless I use the serverSide option.

function myFunction() { 
var table1 = $("#example1").dataTable({
    "ajax": '/api/GetData',
    "serverSide": "true",
    "columns": [
        {
            "data": "DateCreated",                
        },
        { "data": "UserName" }
    ],
    "destroy": true
});

setInterval(function test() {        
    table1.draw(false);
}, 3000);
}

When I omit "serverSide":"true" the table is drawn correctly with the pagination but the ajax is not called with draw(). How can I get the ajax data and have the pagination set correctly?

• javascript
• datatables
• datatables-1.10

Share Follow asked Jul 7, 2015 at 20:35 HeinrichHeinrich 1,76155 gold badges2929 silver badges6363 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 10

Use ajax.reload() to reload the table data from the Ajax data source with false as a second parameter to avoid resetting current paging position.

table1.api().ajax.reload(null, false);

Since your table is initialized using dataTable(), API methods can be accessed with table1.api() method. Otherwise, if table is initialized using DataTable(), API methods can be accessed using table1 directly. See DataTables API for more information.

Make sure your AJAX function is returning: sEcho, iTotalRecords, iTotalDisplayRecords and iDisplayLength.

Also, set "iDisplayLength": 500, at client-side when you call dataTable function.

You can read more about these parameters on https://datatables/forums/discussion/512/clarification-of-itotalrecords-and-itotaldisplayrecords