Hi,
I have two tables on one page, table1, and table2, table1 is working flawlessly. Table2 loads correctly but if I try to sort by clicking on the columnsor even if I call the method again, the the table is empty. I have a function that deletes a row from my db, and I also tried templatetable.rows(id).remove().draw() in the delete callback function which also clears the whole table for data.On initial load all is good

Pls. help, thanks

Code, the one that doesn'r work

This clears the table data. Same method gets called on page load and loads just fine.

I have similar code on many pages also with multiple tables on same page and everything is working.

There's no errors in the console (!!) and when writing each row in createdRow the data is logged correctly in the console

$("#testbtn").on("click",
        function () {
            LoadTemplates();


        });

function LoadTemplates() {
        if (templatetable) {
            
            $('#templateTable').DataTable().destroy();
           
        }
        $.get("/api/konkurs/template", (data) => {
            templatetable = $('#templateTable').DataTable({
                data: data.templates,
                dom: '<"inline pull-left">t<"inline">',
                rowId: 'id',
                scrollResize: true,
                scrollY: 190,
                scrollCollapse: true,
                ordering: false,
                paging: false,
                "aoColumns": [

                    {
                        "data": "title"
                    },
                    {
                        "data": "description"
                    },
                    {
                        "data": null

                    }

                ],
                "columnDefs": [
                    {
                        "render": function (data, type, row) {
                            return '<span class="delete" style="color: red;float: right;"><i class="fad fa-trash-alt"></i></span>';
                            return "";

                        },
                        "targets": 2
                    }


                ],

                "createdRow": function (row, data, index) {

                    // console.log(data);
                }
            });
            $('#templateTable tbody').on('click', 'tr td:last-child', function () {
                var item = templatetable.cell(this).data();
                $("#deleteItemId").val(item.id);
             
                $("#dialogWarning").modal("show");
            });
          
        })


    }

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide