Datatable draws multiple same data after each update

Zevar

Hello everyone, I have a little problem, every time I update my datatable with new data (ajax serverside), from second update, it draws multiple times the same data after each update, because of this datatable becomes slower and nothing helps but page reload. Below is my code:

  $(document).on('click','#btnEdit',function(e){
            e.preventDefault();
            var dataTable=$('#example').DataTable();
            $.ajax({
                    url: "ajax/update_main.php",
                    method: "POST",
                    data: $('#update_data').serialize(),
                    success: function(data) {                  
                    $('#myModal').modal('hide');

            // Clear and redraw datatable on the same page      
                    dataTable.clear().draw(false);  
                        
                        
           dataTable.on( 'draw', function () {

                    alert( 'Table redrawn' );

                    } );    
                        
                    }
                    });                   
                    
        }); 

kthorngren

It looks like you have the draw event creating in the click event handler. This will cause the draw to add a new event each time you click. Move it outside the click event handler so it executes once. If this doesn't help then please post a link to your page or a test case showing the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

Zevar

Thank you Kevin, I will try your suggestion and let you know

Zevar

Hello Kevin, I took draw out of click event handler as you suggested and it solved my problem, thank you