使用DataList将页面滚动到底部时加载更多数据

时间:2016-01-18 03:56:02

标签: c# jquery datalist

我想知道我的代码是什么。我想要做的是当用户滚动到页面底部时,将加载更多数据。我可以使用我设置的页面大小从数据库中获取数据,但是当我滚动到底部时,它只会加载空数据,如图所示。 enter image description here

enter image description here

如第一张图片所示,我获取了这些数据但是当我滚动到底部时,没有显示任何数据。

下面是我的css和c#代码。



<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="TestSite._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<table>
<tr><td>
    <div id="dvCustomers">
        <asp:DataList ID="AllItem" runat="server">
            <ItemTemplate>
                <table cellpadding="2" cellspacing="0" border="1" style="width: 200px; height: 100px;
                border: dashed 2px #04AFEF; background-color: #B0E2F5">
                <tr>
                    <td>
                        <b><u><span class="Item_code">
                            <%# Eval("Item_code")%></span></u></b>
                    </td>
                </tr>
            </table>
            <br />
            </ItemTemplate>
        </asp:DataList>
    </div>
</td>
</tr>
</table>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    var pageIndex = 1;
    var pageCount;
    $(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            GetRecords();
        }
    });
    function GetRecords() {
        pageIndex++;
        if (pageIndex == 2 || pageIndex <= pageCount) {
            $.ajax({
                type: "POST",
                url: "Default.aspx/GetItems",
                data: '{pageIndex: ' + pageIndex + '}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: OnSuccess,
                failure: function (response) {
                    alert(response.d);
                },
                error: function (response) {
                    alert(response.d);
                }
            });
        }
    }
    function OnSuccess(response) {
        var xmlDoc = $.parseXML(response.d);
        var xml = $(xmlDoc);
        pageCount = parseInt(xml.find("PageCount").eq(0).find("PageCount").text());
        var customers = xml.find("Item");
        customers.each(function () {
            var customer = $(this);
            var table = $("#dvCustomers table").eq(0).clone(true);
            $(".Item_code", table).html(customer.find("Item_code").text());
            $("#dvCustomers").append(table).append("<br />");
        });
    }
</script>
</asp:Content>
&#13;
&#13;
&#13;

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            AllItem.DataSource = LoadItems(1);
            AllItem.DataBind();
        }
    }

    [WebMethod]
    public static string GetItems(int pageIndex)
    {
        return LoadItems(pageIndex).GetXml();
    }

    public static DataSet LoadItems(int pageIndex)
    {
        string query = "[listing]";
        SqlCommand cmd = new SqlCommand(query);
        cmd.CommandType = CommandType.StoredProcedure;
        cmd.Parameters.AddWithValue("@PageIndex", pageIndex);
        cmd.Parameters.AddWithValue("@PageSize", 12);

        cmd.Parameters.Add("@PageCount", SqlDbType.Int, 4).Direction = ParameterDirection.Output;
        return GetData(cmd);
    }

    private static DataSet GetData(SqlCommand cmd)
    {
        string strConnString = ConfigurationManager.ConnectionStrings["posConn"].ConnectionString;
        using (SqlConnection con = new SqlConnection(strConnString))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.Connection = con;
                sda.SelectCommand = cmd;
                using (DataSet ds = new DataSet())
                {
                    sda.Fill(ds, "Item");
                    DataTable dt = new DataTable("PageCount");
                    dt.Columns.Add("PageCount");
                    dt.Rows.Add();
                    dt.Rows[0][0] = cmd.Parameters["@PageCount"].Value;
                    ds.Tables.Add(dt);
                    return ds;
                }
            }
        }
    }

如果您需要其他信息,请告诉我们。 任何建议都会非常感激。谢谢

0 个答案:

没有答案