DataTable.ajax.reload() - not working

DataTable.ajax.reload() - not working

cleryclery Posts: 3Questions: 1Answers: 0
edited January 2020 in Free community support

I know this question had been asked many times before, but solutions i find doesn't work for me.

here is my code

$(document).ready(function(){
//draw: 0, recordsTotal: 11 - i get this from the json response when i execute this
    $(document).on('click', '#view', function(){
        $.ajax({
            url: url,
            dataType: "json",
            success: function(data){
                console.log(data);
                $('#data-table').DataTable({
                    destroy: true,
                    processing: true,
                    serverSide: true,
                    pageLength: 1000,
                    responsive: true,
                    dom: '<"html5buttons"B>lTfgitp',
                    ajax: {
                        url: url
                    },
                    order: [1, "ASC"],
                    columns: [
                        { data: "col_one" },
                        { data: "col_two" }
                    ]
                });
                console.log($.fn.DataTable.isDataTable( '#data-table' ));
            },
            error: function(output){
                console.log(output);
            }
        })
    });
  // im trying to pull something here then reload the contents of the table above
  // draw: 2, recordsTotal: 11 - i get this from the response
    $('#getdata').on('submit', function(e){
        e.preventDefault();

        $.ajax({
            url: url,
            type: "POST",
            data: new FormData(this),
            contentType: false,
            cache: false,
            processData: false,
            dataType:"json",
            success: function(data){
                console.log(data);
                $('#data-table').DataTable().ajax.reload(function(a){
                    console.log(a);
                }, true);
                console.log($.fn.DataTable.isDataTable( '#data-table' ));
            },
            error: function(output){
                console.log(output);
            }
        })
    });
})

it sends the correct stream of data im getting and there are no errors on the console.
i was able to pull this off with one datatable on the same page but doesn't seem to work with this one.
both datatables have separate methods and routes. im sure the solution is not that complex, i just can't seem to figure it out

Answers

  • colincolin Posts: 15,146Questions: 1Answers: 2,586

    You've enabled the table with serverSide, so DataTables expects to be making the Ajax requests to the server to get the data it needs. You've configured your table so that DataTables just uses the data returned from Ajax.

    If you don't need serverSide, just remove it; if you do, put it inside the DataTables initialisation like the examples here.

    Colin

  • cleryclery Posts: 3Questions: 1Answers: 0
    edited January 2020

    it still doesn't work. my other datatable is configured just like this and it works. what am i missing?
    and is my initialization correct? im initializing the datatable onclick cause it shows a specific data with an id from the button

    edit: i do intend to use data returned from ajax

  • cleryclery Posts: 3Questions: 1Answers: 0
    edited January 2020

    does it matter if one of the responses is in this format : {dateTimeRead: "2020-01-16 14:26:20", data: "7.89"} - this one is displayed a initialization and
    {dateTimeRead: "2020-01-16 14:26:20", data: 7.89} - this is to be loaded upon reload

  • colincolin Posts: 15,146Questions: 1Answers: 2,586

    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

This discussion has been closed.