CODEWITHSUNDEEP
jquerydatatables
Mukesh Salaria
Mukesh Salaria

Reputation: 4213

jquery datatable adding removed rocords to datatable again when add new data

I am using jquery DataTables, I using ajax to add more rows to table using

 


     $.each(response.aaData, function (key, value) {
                                var TicketId = value[0];
                                var FullName = value[1];
                                var TicketName = value[2];
                                var ReferenceNo = value[3];
                                var StartDate = value[4];
                                var ExpiryDate = value[5];
                                var Status = value[6];
                                var UserId = value[7];

                                var rowNode = oDTable.row.add([
                                  TicketId,
                                   FullName,
                ' ' + TicketName,
                                  ReferenceNo,
                                  StartDate,
                                  ExpiryDate,
                                  "" + Status + "",
                                  UserId,

                                ]).draw().node();

It's adding rows perfectly..

I have single delete button to delete all the rows. Here I am using remove code



$('#EmployeesTicketsDT').on('click', 'tr.group button.del', function (e) {
        var confirm = window.confirm("This will remove usertickets from list, Do you want to   proceed?");
        if (confirm) {                                        $('#EmployeesTicketsDT').DataTable().row($(this).closest('tr').nextUntil('tr.group').remove())
            $('#EmployeesTicketsDT').DataTable().row($(this).closest('tr').remove())
        }
    });

It will remove all the rows under a particular group and stop if reach to next group.

But when i re-add the records it is adding double records one with ajax hit and other is old one...weired.

It should add only new records not old one...please help...

Upvotes: 0

Views: 1041

Answers (2)

Mukesh Salaria
Mukesh Salaria

Reputation: 4213

After a long time I got the solution of this problem,

I user 

.empty()
instead of 
.remove()
.

$('#EmployeesTicketsDT').on('click', 'tr.group button.del', function (e) {
        var confirm = window.confirm("This will remove usertickets from list, Do you want to   proceed?");
        if (confirm) {                                        $('#EmployeesTicketsDT').DataTable().row($(this).closest('tr').nextUntil('tr.group').empty())
            $('#EmployeesTicketsDT').DataTable().row($(this).closest('tr').empty())
        }
    });

Upvotes: 1

Ramzan Zafar
Ramzan Zafar

Reputation: 1600

Try adding 

"bDestroy" : true

in your datatable object init or alternatively you can 

 $('yourtable').dataTable().fnDestroy();

and then recreate it.

Upvotes: 0

Related Questions