简单的ASP.NET无刷新分页

喜欢ヅ旅行 2022-06-12 07:52 195阅读 0赞

前段时间做个留言板的功能，业务要求需要对留言列表的查看翻页无刷新，所以做了以下的无刷新分页功能，虽然比较简单，但是涉及到的知识面蛮多的，我记录一下制作的步骤与心得，仅供参考。如有哪里不足，希望大家指出，有更好的方法，也可以提出来，大家一起学习。

1、新建一个分页存储过程：

CREATE procedure [dbo].[P_Pager]  
       (@PageNumber int,  
       @PageSize int)  
       as 
        declare @sql nvarchar(4000)  
           set @sql = 'select top ' + Convert(varchar, @PageSize)   + ' * from T_Test where [type]=1 and id not in (select top ' + Convert(varchar, (@PageNumber - 1) * @PageSize)  + ' id from T_Test order by id desc) order by id desc' 
        exec sp_executesql @sql  
       GO

2、设置Ajax控件

想要实现无刷新，肯定会用到Ajax，首先是要放入必不可少的：

<asp:ScriptManager ID="ScriptManager1" runat="server">  
 </asp:ScriptManager>

接着把Repeater控件嵌入到UpdatePanel里面去：

<asp:UpdatePanel ID="UpdatePanel1" runat="server">  
            <ContentTemplate>  
                    <ul>  
                        <asp:Repeater ID="Repeater1" runat="server">  
                            <ItemTemplate>  
                                <li>  
                                      
                                        <%#Eval("username") %>：<%#Eval("content").ToString())) %>  
                                      
                                        发表时间：  
                                            <%#Eval("addtime") %>  
                                          
                                      
                                </li>  
                            </ItemTemplate>  
                        </asp:Repeater>  
                    </ul>  
                      
                            总记录：<asp:Literal ID="ltlCount" runat="server"></asp:Literal>  
                          
                            <webdiyer:AspNetPager ID="AspNetPager1" runat="server" AlwaysShow="true" PageIndexBoxType="DropDownList" >  
                            </webdiyer:AspNetPager>  
                          
                    </div>  
            </ContentTemplate>  
        </asp:UpdatePanel>

3、AspNetPager分页控件

可以看到以上的代码有个分页控件，我相信这个分页控件大家都不陌生了，我就不多介绍。必须有AspNetPager.dll，然后在项目中引用，在头部引入这一段代码：

<%@ Register Assembly="AspNetPager" Namespace="Wuqi.Webdiyer" TagPrefix="webdiyer" %>

这时候分页控件应该就可以使用了。最后在后台绑定一下数据，同时也要绑定AspNetPager控件，完整的后台代码如下：

using System;  
       using System.Collections.Generic;  
       using System.Web;  
       using System.Web.UI;  
       using System.Web.UI.WebControls;  
       using System.Data;  
       using Wuqi.Webdiyer;  
       using System.Data.SqlClient;  
          
       public partial class AjaxPager : System.Web.UI.Page  
       {  
           int currentPageNumber;//当前页号   
           int pageSize = 5;//每页显示记录条数  
           protected void Page_Load(object sender, EventArgs e)  
           {  
               if (!IsPostBack)  
               {  
                   currentPageNumber = 1;  
                   ViewState["currentPageNumber"] = currentPageNumber;  
                   BindData();  
               }  
               AspNetPager1.PageChanged += new EventHandler(AspNetPager1_PageChanged);  //定义控件分页事件  
           }  
          
           //获取记录总数  
           private int GetCount()  
           {  
               string sql = "select COUNT(*) from T_Test";  
               DataTable dt = GetTable(sql, CommandType.Text, values);  
               if (dt.Rows.Count > 0)  
               {  
                   return Convert.ToInt32(dt.Rows[0][0]);  
               }  
               else 
               {  
                   return 0;  
               }  
           }  
              
           //绑定数据  
           private void BindData()  
           {  
               ltlCount.Text = GetCount().ToString();  
               currentPageNumber = Convert.ToInt32(ViewState["currentPageNumber"]);  
               SqlParameter[] values = { new SqlParameter("@PageNumber", currentPageNumber), new SqlParameter("@PageSize", pageSize) };  
                  
               DataTable dt = GetTable("P_Pager", CommandType.StoredProcedure, values);  //调用存储过程  
               if (dt.Rows.Count > 0)  
               {  
                   AspNetPager1.PageSize = pageSize;  
                   AspNetPager1.RecordCount = GetCount();  
                   AspNetPager1.CurrentPageIndex = currentPageNumber;  
                   this.Repeater1.DataSource = dt.DefaultView;  
                   this.Repeater1.DataBind();  
               }  
           }  
          
           //分页事件   
           void AspNetPager1_PageChanged(object sender, EventArgs e)  
           {  
               currentPageNumber = AspNetPager1.CurrentPageIndex;  
               ViewState["currentPageNumber"] = currentPageNumber;  
               BindData();  
           }  
              
            // 读取存储过程返回table  
           private DataTable GetTable(string sql, CommandType t, params SqlParameter[] values)  
           {  
               using (SqlConnection conn = new SqlConnection("Data Source=127.0.0.1;Initial Catalog=testDB;Persist Security Info=True;User ID=sa;Password=123456"))  
               {  
                   SqlCommand comm = new SqlCommand(sql, conn);  
                   comm.CommandType = t;  
                   if (values != null && values.Length > 0)  
                       comm.Parameters.AddRange(values);  
                   SqlDataAdapter da = new SqlDataAdapter(comm);  
                   DataSet ds = new DataSet();  
                   try 
                   {  
                       conn.Open();  
                       da.Fill(ds);  
                       return ds.Tables[0];  
                   }  
                   catch (Exception)  
                   {  
                       return null;  
                   }  
                   finally 
                   {  
                       conn.Close();  
                       conn.Dispose();  
                   }  
               }  
           }  
       }

至此，基本大功告成，虽然比较简单，但是涉及到存储过程，Ajax，分页控件等知识点，还是蛮值得收藏和学习的，希望我的这篇文章是抛砖引玉，让大家提供更好的方法，才是我学习的动力。求知若饥，虚心若愚。