Reload data table

jethya@123

I am still able to search for old data from old table even if I get new results or empty table back
info still shows ("showing ___ to ___ of ___ records") for empty table
How to reload or refresh the datatable if new results or no reults to be displayed

if (finalArray.length > 0) { 
                                    $(document).ready(function() {
                                        $('#example thead tr').clone(true).addClass('filters').appendTo( '#cexample thead' );
    
                                                     
                                var table = $('#example').DataTable({
                                        paging: false,
                                        scrollCollapse: true,
                                        scrollY: "50vh",
                                        scrollX: true,                                    
                                        autoWidth: true,
                                        lengthChange: false,                                        
                                        destroy: true,
                                        fixedHeader: true,
                                        data: finalArray,
                                        columnDefs:[
                                            { targets: 0, orderable:false},
                                                                                      
                                        ],
                                       
initComplete: function() {
    debugger;
            var api = this.api();
            api.columns().eq(0).each(function(colIdx) {
                var cell = $('.filters th').eq($(api.column(colIdx).header()).index());
                var title = $(cell).text();
                $(cell).html( '<input type="text" placeholder="'+title+'" />' );
                $('input', $('.filters th').eq($(api.column(colIdx).header()).index()) )
                    .off('keyup change')
                    .on('keyup change', function (e) {
                        e.stopPropagation();
                    
                        $(this).attr('title', $(this).val());
                        var regexr = '({search})'; 
                        var cursorPosition = this.selectionStart;
                       
                        api
                            .column(colIdx)
                            .search((this.value != "") ? regexr.replace('{search}', '((('+this.value+')))') : "", this.value != "", this.value == "")
                            .draw();
                        $(this).focus()[0].setSelectionRange(cursorPosition, cursorPosition);
                    });
            });
            $('.filters th').eq(0).find('input').remove();
        }
    });
   });
}

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

kthorngren

Duplicate of this thread. Please don't duplicate your questions.

How are you currently updating the table with new results?

If you are updating the HTML directly then Datatables won't know about the changes and will continue using the data cache from the original table data, ie data: finalArray,. Use clear() to clear the table and rows.add() to add new rows to the table. Also see this FAQ.

Kevin

jethya@123

It is updated directly through API search.

kthorngren

I guess I don't understand the problem.

I am still able to search for old data from old table even if I get new results

Please provide more details of what this means. I interpreted it as the table data being updated with new rows.

Maybe you can provide a link to your page or build a test case showing the issue with the steps required to see the issue. There is noting obvious in the code posted above to indicate a searching issue.

Kevin