在使用jQuery Ajax和ASP.NET向下滚动页面时加载附加数据

本文关键字：滚动 加载 数据 jQuery Ajax NET ASP | 更新日期: 2023-09-27 18:03:27

我试图在我的项目中应用标题功能，并决定尝试一下，看看它是如何工作的。但是在测试它时，当我滚动到页面底部时，它显示了一个带有Undefined消息的客户端脚本错误。我不知道我在我的代码中做错了什么，我不知道如何让它工作。我希望有人能帮帮我。下面是代码:

转发器 

<div id="dvCampaigns">
    <asp:Repeater ID="rptUsers" 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="campaignname">
                      <%# Eval("CampaignName") %></span></u></b>
                  </td>
               </tr>
               <tr>
                   <td>
                       <b>Description: </b><span class="description">
                          <%# Eval("Description") %></span><br />
                          <b>ID: </b><span class="campaign-id">
                          <%# Eval("CampaignID") %></span><br />
                          <b>Date Created: </b><span class="datecreated">
                         <%# Eval("CreatedOn")%></span><br />
                   </td>
               </tr>
           </table>
           <br />
      </ItemTemplate>
   </asp:Repeater>
</div>
<div>
    <img id="loader" alt="" src="../Images/loading.gif" style="display: none" />
</div>

后台代码

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!this.IsPostBack)
        {
            rptCampaigns.DataSource = GetUserData(1);
            rptCampaigns.DataBind();
        }
    }
    public static TList<POLLice.Entities.Campaigns> GetCampaignData(int pageIndex)
    {
        int totalData;
        var items = new CampaignsService().GetAll(pageIndex, 10, out totalData);
        return items;
    }
    [WebMethod]
    public static string GetCampaigns(int pageIndex)
    {
        var dataset = GetUserData(pageIndex).ToDataSet(true);
        return dataset.GetXml();
    }
jQuery脚本

    <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: "UserProfile/Default.aspx/GetCampaigns",
                    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 campaigns = xml.find("Campaigns");
            campaigns.each(function() {
                var campaign = $(this);
                var table = $("#dvCampaigns table").eq(0).clone(true);
                $(".campaignname", table).html(campaign.find("CampaignName").text());
                $(".description", table).html(campaign.find("Description").text());
                $(".campaign-id", table).html(campaign.find("CampaignID").text());
                $(".datecreated", table).html(campaign.find("CreatedOn").text());
                $("#dvCampaigns").append(table).append("<br />");
            });
            $("#loader").hide();
        }
    </script>
许多谢谢。

在使用jQuery Ajax和ASP.NET向下滚动页面时加载附加数据

在ajax中有这样一行:

url: "UserProfile/Default.aspx/GetCampaigns",

你是否删除了完整的路径，包括http为这篇文章，或者是在你的代码的方式?它需要web方法的相对或绝对路径。当使用ajax调用web方法时，您需要使用:

[ScriptMethod(ResponseFormat = ResponseFormat.Json)] //or whatever your return format is
[WebMethod]
相关文章：