DataTables is not loading when button click in 3rd time

DataTables is not loading when button click in 3rd time

pavaiGpavaiG Posts: 1Questions: 1Answers: 0

I use dataTable in my modal. when I click button, it load modal with table. It correctly happens in first and second time. But in third time, when I click the button, it load modal without dataTable.How can I resolve this?

var Table = $(element).DataTable({
            responsive: true,
            orderCellsTop: true,
            autoWidth: false,
            serverSide: false,
            processing: true,
            lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
            language: {
                processing: "<div class='sk-spinner sk-spinner-three-bounce'><div class='sk-bounce1'></div><div class='sk-bounce2'></div><div class='sk-bounce3'></div></div>"
            },

            ajax: {
                "url": "/web/user/id",
                "type": "GET",
                "error": function (e) {
                    alert(e);
                },
                "dataSrc": function (d) {
                    $(".modal-ajax-container").LoadingOverlay("hide");
                    return d
                }
            },
            deferRender: true,
            columns: [
                {"data": "id", "width": "5%", "visible": false},
                {"data": "name", "width": "10%"},
                {"data": "created", "width": "10%"},
                {"data": "updated", "width": "10%"}
            ],
            colReorder: true,
            dom: "<'row '<'col-sm-6'<'#b3'>><'col-sm-6'>> <'row'>" +
            "<'row'<'col-sm-6'> <'col-sm-6'>>" +
            "<'row'<'col-sm-12'tr>>" +
            "<'row'<'col-sm-5'i><'col-sm-7'p>>",
            order: [[1, 'asc']],
            buttons: [],
            select: {
                style: 'multi'
            }
        });

This is button click function.

$("#btn-attach-custom").on('click', function (e) {
            $("#user-custom-modal").modal();
            $(".modal-ajax-container").LoadingOverlay("show");
            Table = Users.initPolicyPicker("#user-custompicker-table", userID);
}

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Hi @pavaiG ,

    There's nothing obvious in that code as to why it would behave differently on after that third call. When you say it doesn't work, are there console errors? If it loads without the DataTable, i.e. not even an empty table, then that would suggest a problem elsewhere in your code. It would be worth creating a simplified fiddle that isolates the problem if you think the issue is within DataTables, then we can take a look.

    Cheers,

    Colin

This discussion has been closed.