簡(jiǎn)單的ASP.NET無(wú)刷新分頁(yè)

作者：會(huì)編程的羊 2012-04-13 10:05:24

前段時(shí)間做個(gè)留言板的功能，業(yè)務(wù)要求需要對(duì)留言列表的查看翻頁(yè)無(wú)刷新，所以做了以下的無(wú)刷新分頁(yè)功能，雖然比較簡(jiǎn)單，但是涉及到的知識(shí)面蠻多的，我記錄一下制作的步驟與心得，僅供參考。如有哪里不足，希望大家指出，有更好的方法，也可以提出來(lái)，大家一起學(xué)習(xí)。

　　1、新建一個(gè)分頁(yè)存儲(chǔ)過(guò)程：

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、設(shè)置Ajax控件

　　想要實(shí)現(xiàn)無(wú)刷新，肯定會(huì)用到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>  
                                   <p>  
                                       <span><%#Eval("username") %>：</span><%#Eval("content").ToString())) %></p>  
                                   <p>  
                                       <em>發(fā)表時(shí)間：  
                                           <%#Eval("addtime") %>  
                                       </em>  
                                   </p>  
                               </li>  
                           </ItemTemplate>  
                       </asp:Repeater>  
                   </ul>  
                   <p>  
                           總記錄：<asp:Literal ID="ltlCount" runat="server"></asp:Literal></p>  
                       <p>  
                           <webdiyer:AspNetPager ID="AspNetPager1" runat="server" AlwaysShow="true" PageIndexBoxType="DropDownList" >  
                           </webdiyer:AspNetPager>  
                       </p>  
                   </div>  
           </ContentTemplate>  
       </asp:UpdatePanel>

3、AspNetPager分頁(yè)控件

　　可以看到以上的代碼有個(gè)分頁(yè)控件，我相信這個(gè)分頁(yè)控件大家都不陌生了，我就不多介紹。必須有AspNetPager.dll，然后在項(xiàng)目中引用，在頭部引入這一段代碼：

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

這時(shí)候分頁(yè)控件應(yīng)該就可以使用了。***在后臺(tái)綁定一下數(shù)據(jù)，同時(shí)也要綁定AspNetPager控件，完整的后臺(tái)代碼如下：

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;//當(dāng)前頁(yè)號(hào)   
    int pageSize = 5;//每頁(yè)顯示記錄條數(shù)  
    protected void Page_Load(object sender, EventArgs e)  
    {  
        if (!IsPostBack)  
        {  
            currentPageNumber = 1;  
            ViewState["currentPageNumber"] = currentPageNumber;  
            BindData();  
        }  
        AspNetPager1.PageChanged += new EventHandler(AspNetPager1_PageChanged);  //定義控件分頁(yè)事件  
    }  
   
    //獲取記錄總數(shù)  
    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;  
        }  
    }  
       
    //綁定數(shù)據(jù)  
    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);  //調(diào)用存儲(chǔ)過(guò)程  
        if (dt.Rows.Count > 0)  
        {  
            AspNetPager1.PageSize = pageSize;  
            AspNetPager1.RecordCount = GetCount();  
            AspNetPager1.CurrentPageIndex = currentPageNumber;  
            this.Repeater1.DataSource = dt.DefaultView;  
            this.Repeater1.DataBind();  
        }  
    }  
   
    //分頁(yè)事件   
    void AspNetPager1_PageChanged(object sender, EventArgs e)  
    {  
        currentPageNumber = AspNetPager1.CurrentPageIndex;  
        ViewState["currentPageNumber"] = currentPageNumber;  
        BindData();  
    }  
       
     // 讀取存儲(chǔ)過(guò)程返回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();  
            }  
        }  
    }  
}

至此，基本大功告成，雖然比較簡(jiǎn)單，但是涉及到存儲(chǔ)過(guò)程，Ajax，分頁(yè)控件等知識(shí)點(diǎn)，還是蠻值得收藏和學(xué)習(xí)的，希望我的這篇文章是拋磚引玉，讓大家提供更好的方法，才是我學(xué)習(xí)的動(dòng)力。求知若饑，虛心若愚。

原文鏈接：http://www.cnblogs.com/yangyy753/archive/2012/04/12/2444411.html

【編輯推薦】