Clear Table Before Reloding The Data In A Table

I am trying to bind data from the database. what is happening is that it binds every 5 seconds. Now its binding properly but it does not clear the earlier data. it keeps pilling up

Solution 1:

Try clearing all <tr>nodes from your tbody before you append your results:

success: function (response) {
    $("#testTable").find("tbody").empty(); //clear all the content from tbody here.
    $.each(response, function (index, itemData) {
         /*do stuff*/
         $("#testTable").find("tbody").append(tr);
    });
    BindTable();
}

Solution 2:

$('#myTable').empty() 

try to remove the content of the table before the ajax call then fill the data

Solution 3:

<scripttype="text/javascript">
      $(document).ready(function () {
          Get();
           setInterval(function () {
            Get() // this will run after every 5 seconds
            }, 5000);
       });

functionGet() {
    $.ajax({
        type: "POST",
        url: "../adminpage/noti.ashx",
        data: {},
        dataType: "json",
        success: function (response) {

              // Check if response data is not empty if (response) {
              // Empty previous data

                 $("#testTable").empty();
              // Iterate data for each row

                 $.each(response, function (index, itemData) {
                 var tr = "<tr>" +
                              "<td>" + itemData.msg + "</td>" +
                              "<td>" + itemData.dt + "</td>" +
                              "</tr>";

                $("#testTable").find("tbody").append(tr);
            });

            BindTable();
        }
       }
    });
}