在延迟加载时附加不正常

Question

我正忙着处理我的代码。我有一个像下面这样的asp.net页面。

<div id="div_goruntule" style="width:1217px;overflow:auto;height:200px;">
            <asp:GridView ID="gw1" CssClass="gridview1" runat="server" AutoGenerateColumns="false" RowStyle-BackColor="#A1DCF2"
                HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White">
                <Columns>       
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="datas" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="idcolumn" DataField="Id" HeaderText="Id" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="namecolumn" DataField="Name" HeaderText="Name" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="surnamecolumn" DataField="Surname" HeaderText="Surname" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="sexcolumn" DataField="Sex" HeaderText="Sex" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="emailcolumn" DataField="Email" HeaderText="Email" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="citycolumn" DataField="City" HeaderText="City" />
                    <asp:BoundField ItemStyle-Width="150px" ItemStyle-CssClass="agecolumn" DataField="Age" HeaderText="Age" />
                </Columns>
            </asp:GridView>
        </div>

在从数据库获取记录之前，我将10条记录附加到gridview。当用户到达滚动条的底部时，我应该加载下10条记录（11-20），前10条记录。问题是，当代码试图追加第二条10条记录，前10条记录自行删除。我的相关代码如下。我该如何更正呢？

当页面加载时，我会像这样调用前10条记录：

var obj2 = {};
obj2.pageIndex = pageIndex;
obj2.pageSize = 10;

$.ajax({
    type: "POST",
    contentType: "application/json; charset=utf-8",
    url: "ShowRecord.aspx/fnc",
    data: JSON.stringify(obj2),
    dataType: "json",
    success: function (result) {
        $("#gw1").find("td").remove();
        for (var i = 0; i < result.d.length; i++) {
            $("#gw1").append("<tr>"
                + "<td id='options' style='width:150px;'>"
                + "<a href='#' id='edit" + (i + 1) + "' style='padding:0px 20px;'>Edit</a>"
                + "<a href='#' id='delete" + (i + 1) + "' style='padding:0px 20px;'>Delete</a></td>"
                + "<td style='width:150px;'>" + result.d[i].Id + "</td><td class='name' style='width:150px;'>" + result.d[i].Name
                + "</td><td style='width:150px;'>" + result.d[i].Surname + "</td><td class='sex' style='width:150px;'>" + result.d[i].Sex
                + "</td><td style='width:150px;'>" + result.d[i].Email + "</td><td class='city' style='width:150px;'>" + result.d[i].City
                + "</td><td style='width:150px;'>" + result.d[i].Age + "</td></tr>");
        }

    },
    error: function (xhr, status, error) {
        var err = eval("(" + xhr.responseText + ")");
        alert(err.Message);
    }

});

滚动时：

$("#div_goruntule").bind("scroll", function (e) {
    var $o = $(e.currentTarget);
    if ($o[0].scrollHeight - $o.scrollTop() <= $o.outerHeight()) {
        printValues();
    }
});

和

function printValues() {

    pageIndex++;

    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "ShowRecord.aspx/GetRecords",
        data: '{pageIndex:' + pageIndex + '}',
        dataType: "json",
        success: function (result) {
            $("#gw1").find("td").remove();
            for (var i = 0; i < result.d.length; i++) {

                $("#gw1").append("<tr>"
                    + "<td id='options' style='width:150px;'>"
                    + "<a href='#' id='edit" + (i + 1) + "' style='padding:0px 20px;'>Edit</a>"
                    + "<a href='#' id='delete" + (i + 1) + "' style='padding:0px 20px;'>Delete</a></td>"
                    + "<td style='width:150px;'>" + result.d[i].Id + "</td><td class='name' style='width:150px;'>" + result.d[i].Name
                    + "</td><td style='width:150px;'>" + result.d[i].Surname + "</td><td class='sex' style='width:150px;'>" + result.d[i].Sex
                    + "</td><td style='width:150px;'>" + result.d[i].Email + "</td><td class='city' style='width:150px;'>" + result.d[i].City
                    + "</td><td style='width:150px;'>" + result.d[i].Age + "</td></tr>");
            }

        },
        error: function (xhr, status, error) {
            var err = eval("(" + xhr.responseText + ")");
            alert(err.Message);
        }

    });
}

fnc如下：

[System.Web.Services.WebMethod]
    public static ogrenci[] fnc(int pageIndex,int pageSize)
    {
        string text = "Data Source=YP202; Initial Catalog=Ogrenci; Integrated Security=true";

        DataTable dt = new DataTable();
        List<ogrenci> ogrList = new List<ogrenci>();
        using (SqlConnection con = new SqlConnection(text))
        {
            //string commandtext = "exec records5 @SayfadakiKayitSayisi,@SayfaNo";
            //using (SqlCommand command = new SqlCommand("select Id,Name,Surname,Sex,Email,City,Age from dbo.Student", con))
            using(SqlCommand command=new SqlCommand("[records5]"))
            {
                command.Connection = con;
                command.CommandType = CommandType.StoredProcedure;
                command.Parameters.AddWithValue("@SayfadakiKayitSayisi",10);
                command.Parameters.AddWithValue("@SayfaNo",pageIndex);
                SqlDataAdapter da = new SqlDataAdapter(command);
                da.Fill(dt);

                foreach (DataRow dtrow in dt.Rows)
                {
                    ogrenci ogr = new ogrenci();
                    ogr.Id = (int)dtrow["Id"];
                    ogr.Name = dtrow["Name"].ToString();
                    ogr.Surname = dtrow["Surname"].ToString();
                    ogr.Sex = dtrow["Sex"].ToString();
                    ogr.Email = dtrow["Email"].ToString();
                    ogr.City = dtrow["City"].ToString();
                    ogr.Age = (int)dtrow["Age"];
                    ogrList.Add(ogr);
                }

            }
        }
        return ogrList.ToArray();
    }