Fork me on GitHub

简单的ASP.NET无刷新分页 分类: ASP.NET 2012-05-06 02:09 655人阅读 评论(1) 收藏

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

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

  1. CREATE procedure [dbo].[P_Pager]  
  2. (@PageNumber int,  
  3. @PageSize int)  
  4. as 
  5.  declare @sql nvarchar(4000)  
  6.     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' 
  7.  exec sp_executesql @sql  
  8. GO 

 2、设置Ajax控件

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

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

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

  1. <asp:UpdatePanel ID="UpdatePanel1" runat="server">  
  2.            <ContentTemplate>  
  3.                    <ul>  
  4.                        <asp:Repeater ID="Repeater1" runat="server">  
  5.                            <ItemTemplate>  
  6.                                <li>  
  7.                                    <p>  
  8.                                        <span><%#Eval("username") %>:</span><%#Eval("content").ToString())) %></p>  
  9.                                    <p>  
  10.                                        <em>发表时间:  
  11.                                            <%#Eval("addtime") %>  
  12.                                        </em>  
  13.                                    </p>  
  14.                                </li>  
  15.                            </ItemTemplate>  
  16.                        </asp:Repeater>  
  17.                    </ul>  
  18.                    <p>  
  19.                            总记录:<asp:Literal ID="ltlCount" runat="server"></asp:Literal></p>  
  20.                        <p>  
  21.                            <webdiyer:AspNetPager ID="AspNetPager1" runat="server" AlwaysShow="true" PageIndexBoxType="DropDownList" >  
  22.                            </webdiyer:AspNetPager>  
  23.                        </p>  
  24.                    </div>  
  25.            </ContentTemplate>  
  26.        </asp:UpdatePanel> 

3、AspNetPager分页控件

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

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

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

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Web;  
  4. using System.Web.UI;  
  5. using System.Web.UI.WebControls;  
  6. using System.Data;  
  7. using Wuqi.Webdiyer;  
  8. using System.Data.SqlClient;  
  9.    
  10. public partial class AjaxPager : System.Web.UI.Page  
  11. {  
  12.     int currentPageNumber;//当前页号   
  13.     int pageSize = 5;//每页显示记录条数  
  14.     protected void Page_Load(object sender, EventArgs e)  
  15.     {  
  16.         if (!IsPostBack)  
  17.         {  
  18.             currentPageNumber = 1;  
  19.             ViewState["currentPageNumber"] = currentPageNumber;  
  20.             BindData();  
  21.         }  
  22.         AspNetPager1.PageChanged += new EventHandler(AspNetPager1_PageChanged);  //定义控件分页事件  
  23.     }  
  24.    
  25.     //获取记录总数  
  26.     private int GetCount()  
  27.     {  
  28.         string sql = "select COUNT(*) from T_Test";  
  29.         DataTable dt = GetTable(sql, CommandType.Text, values);  
  30.         if (dt.Rows.Count > 0)  
  31.         {  
  32.             return Convert.ToInt32(dt.Rows[0][0]);  
  33.         }  
  34.         else 
  35.         {  
  36.             return 0;  
  37.         }  
  38.     }  
  39.        
  40.     //绑定数据  
  41.     private void BindData()  
  42.     {  
  43.         ltlCount.Text = GetCount().ToString();  
  44.         currentPageNumber = Convert.ToInt32(ViewState["currentPageNumber"]);  
  45.         SqlParameter[] values = { new SqlParameter("@PageNumber", currentPageNumber), new SqlParameter("@PageSize", pageSize) };  
  46.            
  47.         DataTable dt = GetTable("P_Pager", CommandType.StoredProcedure, values);  //调用存储过程  
  48.         if (dt.Rows.Count > 0)  
  49.         {  
  50.             AspNetPager1.PageSize = pageSize;  
  51.             AspNetPager1.RecordCount = GetCount();  
  52.             AspNetPager1.CurrentPageIndex = currentPageNumber;  
  53.             this.Repeater1.DataSource = dt.DefaultView;  
  54.             this.Repeater1.DataBind();  
  55.         }  
  56.     }  
  57.    
  58.     //分页事件   
  59.     void AspNetPager1_PageChanged(object sender, EventArgs e)  
  60.     {  
  61.         currentPageNumber = AspNetPager1.CurrentPageIndex;  
  62.         ViewState["currentPageNumber"] = currentPageNumber;  
  63.         BindData();  
  64.     }  
  65.        
  66.      // 读取存储过程返回table  
  67.     private DataTable GetTable(string sql, CommandType t, params SqlParameter[] values)  
  68.     {  
  69.         using (SqlConnection conn = new SqlConnection("Data Source=127.0.0.1;Initial Catalog=testDB;Persist Security Info=True;User ID=sa;Password=123456"))  
  70.         {  
  71.             SqlCommand comm = new SqlCommand(sql, conn);  
  72.             comm.CommandType = t;  
  73.             if (values != null && values.Length > 0)  
  74.                 comm.Parameters.AddRange(values);  
  75.             SqlDataAdapter da = new SqlDataAdapter(comm);  
  76.             DataSet ds = new DataSet();  
  77.             try 
  78.             {  
  79.                 conn.Open();  
  80.                 da.Fill(ds);  
  81.                 return ds.Tables[0];  
  82.             }  
  83.             catch (Exception)  
  84.             {  
  85.                 return null;  
  86.             }  
  87.             finally 
  88.             {  
  89.                 conn.Close();  
  90.                 conn.Dispose();  
  91.             }  
  92.         }  
  93.     }  

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

posted @ 2012-05-06 02:09  zhiqiang21  阅读(217)  评论(0编辑  收藏  举报