CODEWITHSUNDEEP
jqueryhtmlajaxdatatable
Redzwan Latif
Redzwan Latif

Reputation: 886

Refresh DataTable after a remove() done

I've done a row remove() and then I tried to fnDestroy() and initialize back the DataTable. The record count and the pagination does not effected(The *DataTable not refreshed)*.

I've also tried to use fnDraw() but it's still no use.

I've looked at the page source and the deleted row html is still there.

I'm using Ajax to delete the row. Appreciate your help

This is my delete script:

$(document).ready(function()
        {
            $('table#sample_1 td a.delete').click(function()
            {
                if (confirm("Are you sure you want to delete this row?"))
                {
                    var id = $(this).parent().parent().attr('id');
                    var data = 'id=' + id ;
                    var parent = $(this).parent().parent();

                    $.ajax(
                    {
                           type: "POST",
                           url: "process.php",
                           dataType: "json",
                           data: data,
                           cache: false,

                           success: function()
                           {

                            var dtable = $('#sample_1').dataTable();
                        dtable.fnDestroy();


                        parent.fadeOut('slow', function() {$(this).remove();});


                        //Reinitialize the datatable
                        $('#sample_1').dataTable({
                                    "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
                                    "sPaginationType": "bootstrap",
                                    "oLanguage": {
                                        "sLengthMenu": "_MENU_ records per page",
                                        "oPaginate": {
                                            "sPrevious": "Prev",
                                            "sNext": "Next"
                                        }
                                    },
                                    "aoColumnDefs": [{
                                        'bSortable': false,
                                        'aTargets': [0]
                                    }]
                        });

                           }
                     });
                }
            });


        });


        </script>

Upvotes: 3

Views: 16641

Answers (3)

Umut Koseali
Umut Koseali

Reputation: 885

It is going to cache all off the information in the initialization and when you try to do some actions ( i.e. sorting ) it will re-draw the table with existing data set. Therefore, you should use draw( false ) to prevent re-drawing. 

 table.row('.selectedRow').remove().draw( false );

Upvotes: 2

Pratik Gadoya
Pratik Gadoya

Reputation: 1511

You can use this code:

var rowid = document.getElementById(id);
var Pos = dt.fnGetPosition(rowid);
dt.fnDeleteRow(Pos);

Here id is unique row id which you want to delete.

Upvotes: 1

Manu M
Manu M

Reputation: 1064

You can use fnDeleteRow to delete a row in the datatable. This function will automatically redraw the table.

Refer this, http://datatables.net/api

Upvotes: 2

Related Questions