Datatable Ajax reload not working on button click

Question

I've been trying to work with a reload button that will load the datatable data, but whenever i press the button, the table is not reloading or not loading the new content.

Here's my code for Datatable

  var table = $('#m_table_1').dataTable({
        responsive: true,
        searchDelay: 500,
        processing: true,
        serverSide: true,
        ajax: 'http://digitalbulletinboard.xyz/bulletin/sample.php?getLostTable',
        columns: [
            {data: 'id'},
            {data: 'title'},
            {data: 'description'},
            {data: 'Actions'},
        ],
        columnDefs: [
            {
                targets: -1,
                title: 'Actions',
                orderable: false,
                render: function(data, type, full, meta) {
                    console.log(data);
                    return `
                        <span class="dropdown">
                            <a href="#" class="btn m-btn m-btn--hover-brand m-btn--icon m-btn--icon-only m-btn--pill" data-toggle="dropdown" aria-expanded="true">
                              <i class="la la-ellipsis-h"></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-right">
                                <a class="dropdown-item" href="#"><i class="la la-edit"></i> Edit Details</a>
                                <a class="dropdown-item" href="#"><i class="la la-leaf"></i> Update Status</a>
                                <a class="dropdown-item" href="#"><i class="la la-print"></i> Generate Report</a>
                            </div>
                        </span>
                        <button type="button" class="m-portlet__nav-link btn m-btn m-btn--hover-brand m-btn--icon m-btn--icon-only m-btn--pill" title="View" id="reload">
                          <i class="la la-edit"></i>


          </button>`;
            },
        }
    ],
});

And when clicking the reload button, I use this one

 $("#reload").click(function () {
        console.log("Reload");
        table.api().ajax.reload(null, false);
    });

Whenever i click the reload button. Nothing happens. is there a way to fix this? or something that I have done wrong?

I already tried but still nothing happens

 $('#m_table_1').dataTable().api().ajax.reload();

Edit 1: Changed the reload to

table.ajax.processing(null, false);

and got stuck to this one.

YANZ · Accepted Answer · 2019-01-05 17:23:04Z

1

You didn't mention the version of DataTable you used. But for many cases situation you can try this one:

table.ajax.reload( null, false );

at least it works for latest version of DataTable.

Referenced from here: https://datatables.net/reference/api/ajax.reload()

answered Jan 5, 2019 at 17:23

YANZ

3861 gold badge7 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

YANZ Over a year ago

Did you try my code? table.ajax.reload( null, false ); without api() or processing()

AmyllaVimiar Over a year ago

Thank you this works, I also edited my server side to match the problem.

Collectives™ on Stack Overflow

Datatable Ajax reload not working on button click

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related