Pfthb

I have initial value on my table and I created a button that supposedly clear and override new value to my table. But what happening in my current script is if I clicked my button the table will just append a new row.

Here is my current loader:

function RefreshData() 

 $.ajax(
 url: '/Home/GetItemList',
 type: 'GET',

 dataType: 'json',
 success: function (data) 
 console.log(data);
 var row = '';
 $('.table tbody').html("");
 $.each(data, function (i, item) 
 row += '<tr><td style="display:none;" >' + item.empSerial + '</td><td width="50%">' + item.name
 + '</td><td width="30%">' + item.dept
 + '</td><td style="display:none;" >' + item.fname
 + '</td><td style="display:none;" >' + item.lname
 + '</td><td>' + '<button onclick="delete(this, ' + item.empSerial + ",'" + item.name + "'" + ')" type="button" class="btn btn-danger"> Remove </button >'
 + '</td><td>' + '<button onclick="update(this, ' + item.empSerial + ",'" + item.fname + ",'" + item.lname + ",'" + item.dept + ",'" + item.name + "'" + ')" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalPMA"> Update </button >' + '</td></tr>';

 );
 $('.table tbody').html(row); // override previous results
 ,

 error: function (jqXhr, textStatus, errorThrown) 
 console.log(errorThrown.toString());
 
 );

 

table is a element not a class .table so remove dot . from it.

$('table tbody').html("");