我正在使用 UserControl（这是一个嵌套的 GridView）创建一堵墙，我想像 facebook 一样在向下滚动时加载 GridView 的行。我正在尝试实现此方法.. 单击此处该示例似乎读取了最后一行的第一列以获取加载的最后一行并获取下一行。我在我的 UserControl 的 GridView 中添加了一个绑定字段，但我想我无法读取正确的值，因为我收到错误“输入字符串的格式不正确”。在 ..
protected void btnGetMoreRecords_Click(object sender, EventArgs e)
{
//Fetch 14 records initially.
dt = dbo.FetchNextProducts(Convert.ToInt32(hiddenLastProductID.Value), 14, 42);
这是我的用户控件的aspx代码..
<asp:ScriptManager ID="sm1" runat="server">
<Scripts>
<asp:ScriptReference Path="~/ScriptsScroll/jquery-1.4.1.js" />
</Scripts>
</asp:ScriptManager>
<div id="divProducts" style="height:700px;overflow-x:hidden;overflow-y: scroll;">
<table cellpadding="0" cellspacing="1" border="0">
<tr>
<td align="left">
<asp:GridView ID="GridViewUserScraps" ItemStyle-VerticalAlign="Top" AutoGenerateColumns="False"
GridLines="None" Width="100%" ShowHeader="False" runat="server" AlternatingRowStyle-BackColor="#A5A5A5"
CellPadding="4" ForeColor="#333333" DataKeyNames="ScrapId" OnRowCommand="GridViewRowCommand">
<Columns>
<asp:BoundField DataField="id" />
<asp:TemplateField>
<FooterTemplate>
<asp:LinkButton ID="LinkButton1" runat="server">Load More</asp:LinkButton>
</FooterTemplate>
<ItemTemplate>
<table align="left" cellpadding="1" cellspacing="2">
<tr>
<td>
<a href='<%#getUserHREF(Container.DataItem)%>'>
<img align="middle" src='<%#getSRC(Container.DataItem)%>' border="0" width="50px" /></a>
</td>
<td>
</td>
</tr>
</table>
<div align="justify">
<b>
<%#DataBinder.Eval(Container.DataItem,"firstname")%>
</b>
<br />
<%#DataBinder.Eval(Container.DataItem, "Message")%>
<br />
<asp:Image ID="Image" runat="server" ImageUrl='<%# Eval("url") %>' style="max-width:500px;" />
</div>
<span class="SmallBlackText">Posted On: </span>
<asp:Label ID="lblSendDate" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"SendDate")%>'></asp:Label>
</span>
<br />
<%-- <asp:LinkButton ID="lnklike" runat="server"
CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"
CommandName="LikeCmd">Like</asp:LinkButton>
<asp:LinkButton ID="lnkunlike" runat="server">unlike</asp:LinkButton>--%>
<asp:ImageButton ID="lnklike" runat="server" ImageUrl="~/Images/thumbsup.png" Height="20px"
Width="20px" CommandName="like" CommandArgument='<%# Eval("ScrapId")%>' />
<asp:UpdatePanel runat="server" ID="UpdatePanel" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lnklike" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Controls_GetUserScraps.abc((int)Eval("ScrapId")) %>' />
</ContentTemplate>
</asp:UpdatePanel>
<%--<asp:Label ID="Label1" runat="server" Text='<%# WebPageName.StaticMethodName((int)Eval("ScrapId")) %>' />--%>
<asp:ImageButton ID="lnkunlike" runat="server" CommandArgument='<%# Eval("ScrapId")%>'
CommandName="unlike" Height="20px" ImageUrl="~/Images/thumbsdown.png" Width="20px" />
<asp:UpdatePanel runat="server" ID="UpdatePanel2" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lnkunlike" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Controls_GetUserScraps.xyz((int)Eval("ScrapId")) %>'></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:LinkButton ID="lnkcomment" runat="server">Comment</asp:LinkButton>
<asp:LinkButton ID="lnkviewall" runat="server" CommandName="viewall" CommandArgument='<%# Eval("ScrapId")%>'>View All</asp:LinkButton>
<br />
<asp:Panel ID="Pnlchildgrid" runat="server">
<asp:GridView ID="childgrid" runat="server" AutoGenerateColumns="False" OnRowCommand="childgrid_RowCommand"
Style="width: 450px; float: right;">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<table align="left" cellpadding="1" cellspacing="2">
<tr>
<td>
<a href='<%#getUserHREF(Container.DataItem)%>'>
<img align="middle" src='<%#getSRC(Container.DataItem)%>' border="0" width="30px" /></a>
</td>
<td>
</td>
</tr>
</table>
<div align="justify">
<b>
<%#DataBinder.Eval(Container.DataItem, "firstname")%></b><br />
<%#DataBinder.Eval(Container.DataItem, "commentmsg")%>
<br />
</div>
<span class="SmallBlackText">Posted On: </span>
<asp:Label ID="lblSendDate" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"SendDate")%>'></asp:Label>
</span>
<br />
<asp:ImageButton ID="lnklike" runat="server" Height="20" Width="20" CommandName="childlike"
CommandArgument='<%# Eval("commentid")%>' ImageUrl="~/Images/thumbsup.png" />
<asp:Label ID="Label1" runat="server" Text='<%# Controls_GetUserScraps.abc1((int)Eval("commentid")) %>' />
<asp:ImageButton ID="lnkunlike" runat="server" CommandArgument='<%# Eval("commentid")%>'
CommandName="childunlike" Height="20" ImageUrl="~/Images/thumbsdown.png" Width="20" />
<asp:Label ID="Label2" runat="server" Text='<%# Controls_GetUserScraps.xyz1((int)Eval("commentid")) %>'></asp:Label>
<%-- <asp:LinkButton ID="lnkcomment" runat="server">Comment11111</asp:LinkButton>--%>
<br />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<br />
<asp:Panel ID="Panel1" runat="server">
<asp:TextBox ID="txtcomment" runat="server" Width="500px" ></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Comment" CommandName="comment" CommandArgument='<%# Eval("ScrapId")%>' />
</asp:Panel>
</asp:Panel>
<br />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle BackColor="#EFF3FB" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
</td>
</tr>
<tr>
<td align="left">
</td>
</tr>
</table>
</div>
<div><asp:HiddenField runat="server" ID="hiddenLastProductID" />
<asp:Button runat="server" Text="Get More records" ID="btnGetMoreRecords"
onclick="btnGetMoreRecords_Click" />
</div>
<div id="divProgress" style="margin-top: -50px;margin-left:150px;z-index:-999">
<img src="../loading.gif" width="100" height="100" alt="" />
</div>
<div>
</div>
<script type="text/javascript">
var previousProductId = 0;
//Max records to display at a time in the grid.
var maxRecordsToDisplay = 30;
$(document).ready(function () {
//initially hide the loading gif
$("#divProgress").hide();
//initially hide the button
$("#btnGetMoreRecords").hide();
//Attach function to the scroll event of the div
$("#divProducts").scroll(function () {
var scrolltop = $('#divProducts').attr('scrollTop');
var scrollheight = $('#divProducts').attr('scrollHeight');
var windowheight = $('#divProducts').attr('clientHeight');
var scrolloffset = 20;
if (scrolltop >= (scrollheight - (windowheight + scrolloffset))) {
//User has scrolled to the end of the grid. Load new data..
$("#divProgress").ajaxStart(function () {
$(this).show();
});
$("#divProgress").ajaxStop(function () {
$(this).hide();
});
BindNewData();
}
});
});
function BindNewData() {
//
var lastProductId = $("#<%=GridViewUserScraps.ClientID %> tr:last").children("td:first").html();
//get last table row in order to append the new products
var lastRow = $("#<%=GridViewUserScraps.ClientID %> tr:last");
//Fetch records only when the no. of records displayed in the grid are less than limit.
if (GetRowsCount() < maxRecordsToDisplay) {
if (parseInt(lastProductId, 10) > parseInt(previousProductId, 10)) {
previousProductId = lastProductId;
$.post("FetchRecordsHandler.ashx?lastProductId=" + lastProductId, function (data) {
if (data != null) {
//append new products rows to last row in the gridview.
lastRow.after(data);
}
});
}
}
else {
//Set value of last product id in hidden field so that we can access it from code behind.
$("#hiddenLastProductID").val(lastProductId);
//Check If there is more records in the database
if (parseInt(lastProductId, 10) > parseInt(previousProductId, 10))
$("#btnGetMoreRecords").show();
}
}
function GetRowsCount() {
//Count no. of rows except header row in the grid.
//var rowCount = $('#GridView1 tr').length - 1;
var rowCount = $('[id*=GridViewUserScraps] tr');
return rowCount;
}
</script>