Question

I have an js file that appends data from webmethod to a gridview. My problem is whenever I’m clicking again my button, it appends and added the new data with the previous data in the gridview. Is there a way to remove the last appended data and append a new one? Another question. In binding a gridview, I need to bind a datasoure upon loading of the page, in order to have it to display the data that I want to append. How can I remove that datasource that I binded when trying to append a new one? Sorry for the long and many questions. THANKS!

$.ajax({
   url: "Default.aspx/getDetails",
   data: Data,
   type: "POST",
   dataType: "json",
   contentType: "application/json; charset=utf-8",
   success: function (mydata) {
   for (var i = 0; i < mydata.d.length; i++) {
       $(".rpt").html("<table id=\"tbl\"><tr>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Date Joined</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Memberid</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Member ID</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>User ID</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Username</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Password</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Full Name</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>First Name</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Last Name</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Birth Date</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Address</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Location</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Sponsor ID</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Parent ID</th>" +
                         "<th style='background-color: #75a844' class='tbl_h'>Placement</th>" +
                         "</tr>");

            for (var i = 0; i < mydata.d.length; i++) {
                $("#tbl").append("<tr><td>" + mydata.d[i].datejoined +
                                                                   "</td><td>" + mydata.d[i].memid +
                                                                   "</td><td>" + mydata.d[i].memberid +
                                                                   "</td><td>" + mydata.d[i].userid +
                                                                   "</td><td>" + mydata.d[i].usrname +
                                                                   "</td><td>" + mydata.d[i].pssword +
                                                                   "</td><td>" + mydata.d[i].fullname +
                                                                   "</td><td>" + mydata.d[i].fname +
                                                                   "</td><td>" + mydata.d[i].mname +
                                                                   "</td><td>" + mydata.d[i].lname +
                                                                   "</td><td>" + mydata.d[i].bdate +
                                                                   "</td><td>" + mydata.d[i].address +
                                                                   "</td><td>" + mydata.d[i].location +
                                                                   "</td><td>" + mydata.d[i].sponsorid +
                                                                   "</td><td>" + mydata.d[i].parentid +
                                                                   "</td><td>" + mydata.d[i].placement + "</td></tr>");
            }
            $("#tbl").append("</table>");
        }
    });

Answer 1

cacheBoolean
Default: true, false for dataType ‘script’ and ‘jsonp’
If set to false, it will force requested pages not to be cached by the browser. Setting cache to false also appends a query string parameter, “_=[TIMESTAMP]”, to the URL.

cache : false,

---

If your #Grid1D has no other elements inside you can also do:

$("#Grid1D").html(
       // ...
);

instead of .append()