scoll之后没有显示一个现场数据 [英] One field data is not showing after scoll

问题描述

我在我的应用程序中使用无限滚动..我绑定数据库中的三个字段：

1. Id

2. Imageurl

3. product_name



无限滚动工作完全正常..所有三个字段的数据都是在第一次尝试时显示..但问题是当数据附加后滚动..滚动后只有两个字段显示id和product_name ..滚动后Imageurl没有显示...我从过去2天努力解决问题...但我无法对它进行排序我试过差不多......现在，我来这里是为了得到你们的帮助..希望你能帮我理清我的问题..



这是我的Jquery代码：

I am using infinite scroll in my application.. I am binding three fields from database :
1. Id
2. Imageurl
3. product_name

Infinite scroll is working totally fine.. All three fields data is showing on the first attempt.. but the problem is coming when the data attached after the scroll.. after scrolling only two fields are showing id and product_name.. Imageurl is not showing after the scroll... I am trying so hard from past 2 days to solve the problem... But i am not able to sort it out.. i tried almost everthing... Now, i am here to get help from you guyz.. hope you will help me to sort out my problem..

Here is my Jquery Code :

<pre lang="cs"><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) {
            $("#loader").show();
            $.ajax({
                type: "POST",

                url: '<%= Page.ResolveUrl("~/Products.aspx/GetCustomers")%>',
                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("add_product");
        customers.each(function () {
            var customer = $(this);
            var div = $("#dvCustomers div").eq(0).clone(true);

            $(".product_name", div).html(customer.find("Product_name").text());
            $(".imageurl", div).html(customer.find("Imageurl").text());

            $(".id", div).html(customer.find("ID").text());



            $("#dvCustomers").append(div).append("<br />");
        });
        $("#loader").hide();
    }
</script>

以下是Html：

Below is the Html :

<div id="dvCustomers">
        <asp:Repeater ID="rptCustomers" runat="server">
            <ItemTemplate>
            <div>
            <span class="imageurl"><%# Eval("Imageurl") %></span><br />
                             <span class="id"><%# Eval("Id") %></span><br />
                            <span class="product_name"><%# Eval("Product_name") %></span><br /><br />
                          </div>
            </ItemTemplate>
        </asp:Repeater>
    </div>

<div><img id="loader" alt="" src="images/loading.gif" style="display: none" /></div>

这是我的代码背后：

Here is my Code behind :

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

    public static DataSet GetCustomersData(int pageIndex)
    {
        int pageSize = 12;
        int pagecount = 100;
        string query = "select * from (select ROW_NUMBER() OVER (ORDER BY product_name) rn ,* from add_product) a where rn BETWEEN(@PageIndex -1) * @PageSize + 1 AND(((@PageIndex -1) * @PageSize + 1) + @PageSize) - 1";
       

        SqlCommand cmd = new SqlCommand(query);
        cmd.CommandType = CommandType.Text;
        cmd.Parameters.AddWithValue("@PageIndex", pageIndex);
        cmd.Parameters.AddWithValue("@PageSize", pageSize);
        cmd.Parameters.AddWithValue("@PageCount", pagecount);
        return GetData(cmd);
    }
    private static DataSet GetData(SqlCommand cmd)
    {
        string strConnString = ConfigurationManager.ConnectionStrings["database_con"].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, "add_product");
                    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;
                }
            }
        }
    }

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

推荐答案

（ window ）。scroll（< span class =code-keyword> function （）{
if （

(window).scroll(function () { if (

（< span class =code-sdkkeyword> window ）。scrollTop（）==

(window).scrollTop() ==

（ document ）。 height（） -

(document).height() -

这篇关于scoll之后没有显示一个现场数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！