asp.net分頁功能實現(xiàn)

更新時間：2015年09月27日 14:40:12 投稿：lijiao

這篇文章主要介紹了asp.net分頁功能是如何實現(xiàn)的，有整個解析思路，希望對大家的學習有所幫助。

說一下實現(xiàn)分頁的思路

這里的分頁用到了一個組件 AspNetPage.dll,這個組件大家可以到網上去下載，我這里就不提供了

添加最近到工具箱中這樣我們就可以像其他控件一樣拖拽使用了

如圖DataPage是在工具箱中的，至于怎么添加你們百度吧

拖拽到頁面中如圖

這個是我加完樣式后顯示的效果，怎么樣是不是你們想要的了，如果不是你們還可以修改樣式樣式稍候奉上

先來看看要怎么使用

 <webdiyer:AspNetPager ID="AspNetPager1" runat="server" AlwaysShow="true" 
      PageSize="20" CssClass="paginator"  CurrentPageButtonClass="cpb"
     LastPageText="尾頁" FirstPageText="首頁" PrevPageText="上一頁" NextPageText="下一頁"
      UrlPaging="false" NumericButtonTextFormatString="{0}" 
      ShowCustomInfoSection="Left" onpagechanged="AspNetPager1_PageChanged" CustomInfoTextAlign="Left" LayoutType="Table" >
 </webdiyer:AspNetPager>

這個就是分頁控件生成的代碼

其中顯示的首頁，上一頁，下一頁，尾頁，這些都可以在屬性中定下要顯示什么，也可以是圖片，具體的要靠你們自己去研究了

PageSize屬性設置每頁顯示的條數(shù)

UrlPageing這個屬性可以設置分頁的提交的方式，設置為true時使用url傳遞參數(shù)提交（經過自己測試這樣頁面會刷新，所以我沒有使用url傳遞參數(shù)提交）

ShowCustomInfoSection設置顯示的的位置有左中右三個值，至于什么意思你懂的

onpagechanged這個事件為點擊分頁按鈕時的事件，奉上代碼

 //分頁事件
    protected void AspNetPager1_PageChanged(object sender, EventArgs e)
    {
      BindView(ViewState["dataSource"] as List<Tbl_Teacher>);
    }

這里我調用了一個自定義綁定數(shù)據(jù)源的方法BindView

 //綁定數(shù)據(jù)源
    public void BindView(List<Tbl_Teacher> ls)
    {
      this.AspNetPager1.RecordCount = ls.Count();
      this.GridView1.DataSource = ls.Skip((AspNetPager1.CurrentPageIndex - 1) * AspNetPager1.PageSize).Take(AspNetPager1.PageSize);
      this.GridView1.DataBind();
      this.AspNetPager1.CustomInfoHTML = string.Format("當前第{0}/{1}頁 共{2}條記錄 每頁{3}條", new object[]

{ this.AspNetPager1.CurrentPageIndex, this.AspNetPager1.PageCount, this.AspNetPager1.RecordCount, this.AspNetPager1.PageSize });

    }

這里是綁定數(shù)據(jù)源，為了方便我使用的是linq來進行的分頁，當然這里可以任由你來更改，可以使用存儲過程，也可以傳遞直接用sql查詢，主要就兩個參數(shù)，

一個顯示的條數(shù)，一個當前的頁數(shù)，相信對于你們來說都不難事

到這里基本上已經貼出了所有代碼，可能描述的不是很清楚，但也就這樣了，本人水平有限。下面貼上兩種樣式：

<style type="text/css">
/*拍拍網風格*/
.paginator { font: 11px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
.paginator a {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;margin-right:2px}
.paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
.paginator .cpb {padding: 1px 6px;font-weight: bold; font-size: 13px;border:none}
.paginator a:hover {color: #fff; background: #ffa501;border-color:#ffa501;text-decoration: none;}

/*淘寶風格*/
.paginator { font: 12px Arial, Helvetica, sans-serif;padding:10px 20px 10px 0; margin: 0px;}
.paginator a {border:solid 1px #ccc;color:#0063dc;cursor:pointer;text-decoration:none;}
.paginator a:visited {padding: 1px 6px; border: solid 1px #ddd; background: #fff; text-decoration: none;}
.paginator .cpb {border:1px solid #F50;font-weight:700;color:#F50;background-color:#ffeee5;}
.paginator a:hover {border:solid 1px #F50;color:#f60;text-decoration:none;}
.paginator a,.paginator a:visited,.paginator .cpb,.paginator a:hover 
{float:left;height:16px;line-height:16px;min-width:10px;_width:10px;margin-right:5px;text-align:center;
 white-space:nowrap;font-size:12px;font-family:Arial,SimSun;padding:0 3px;}
 </style>

總結：這個分頁組件與數(shù)據(jù)分離，只提供了顯示頁數(shù)的功能，數(shù)據(jù)可以根據(jù)組件記錄的頁數(shù)和條數(shù)來進行綁定數(shù)據(jù)源，還是很方便的。

如果ASP.NET實現(xiàn)分頁功能的描述還不夠完整，還請你們補上，大家共同學習。

您可能感興趣的文章: