asp.net webform自定义分页控件

做web开发一直用到分页控件，自己也动手实现了个，使用用户自定义控件。

翻页后数据加载使用委托，将具体实现放在在使用分页控件的页面进行注册。

有图有真相，给个直观的认识：

自定义分页控件前台代码：

<style type="text/css"> .pager-m-l {  margin-left: 10px; } .pager {  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;  font-size: 14px;  color: #333;  background-color: #fff;  text-align: center;  border: 1px solid #eee;  border-radius: 5px;  height: 30px;  line-height: 30px;  margin: 10px auto;  width: 650px; } .font-blue {  color: #5bc0de; } .pager a {  color: #5bc0de;  text-decoration: none; }  .pager a.gray {   color: #808080;  } .pager-num {  width: 30px;  text-align: center; } .pager-form-control {  color: #555;  background-color: #fff;  background-image: none;  border: 1px solid #ccc;  border-radius: 4px;  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;  padding: 2px 0px;  margin: 0px 2px; }  .pager-form-control:focus {   border-color: #66afe9;   outline: 0;   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);   box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);  } .btn {  display: inline-block;  padding: 2px;  font-weight: normal;  text-align: center;  white-space: nowrap;  vertical-align: middle;  -ms-touch-action: manipulation;  touch-action: manipulation;  cursor: pointer;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  background-image: none;  border: 1px solid transparent;  border-radius: 4px; } .btn-default {  color: #333;  background-color: #fff;  border-color: #ccc; }</style><div class="pager"> <span>当前<asp:Label runat="server" ID="labCurrentPageIndex" CssClass="font-blue"></asp:Label>/<asp:Label runat="server" CssClass="font-blue" ID="labTotalNumberOfPages"></asp:Label>页</span> <span class="pager-m-l">共<asp:Label runat="server" CssClass="font-blue" ID="labRecordCount"></asp:Label>条记录</span> <span class="pager-m-l">  <asp:LinkButton runat="server" ID="labFirstPage" OnClick="labFirstPage_Click">首页</asp:LinkButton>  |  <asp:LinkButton runat="server" ID="labPreviousPage" OnClick="labPreviousPage_Click"></asp:LinkButton>  |<asp:LinkButton runat="server" ID="labNextPage" OnClick="labNextPage_Click"></asp:LinkButton>  |<asp:LinkButton runat="server" ID="labLastPage" OnClick="labLastPage_Click">尾页</asp:LinkButton> </span> <span class="pager-m-l">跳至<asp:TextBox runat="server" ID="txtPageNum" CssClass="pager-form-control pager-num">1</asp:TextBox>页  <asp:Button runat="server" Text="" ID="btn" CssClass="btn btn-default" OnClick="btn_Click" /></span> <span class="pager-m-l">  <asp:DropDownList runat="server" ID="ddlPageSize" CssClass="pager-form-control" AutoPostBack="true" OnSelectedIndexChanged="ddlPageSize_SelectedIndexChanged">   <asp:ListItem Text="10" Value="10"></asp:ListItem>   <asp:ListItem Text="20" Value="20"></asp:ListItem>   <asp:ListItem Text="30" Value="30"></asp:ListItem>   <asp:ListItem Text="50" Value="50"></asp:ListItem>   <asp:ListItem Text="100" Value="100"></asp:ListItem>  </asp:DropDownList>条/每页</span></div>

自定义分页控件后台代码：

private const string viewStateCurrentPageIndex = "CurrentPageIndex";  private const string viewStateRecordCount = "RecordCount";  public delegate void PageChangedHandle();  public event PageChangedHandle OnPageChanged;  public int PageSize  {   get   {    return Convert.ToInt32(ddlPageSize.SelectedValue);   }  }  public int CurrentPageIndex  {   set   {    ViewState[viewStateCurrentPageIndex] = value;   }   get   {    if (ViewState[viewStateCurrentPageIndex] == null)    {     ViewState[viewStateCurrentPageIndex] = 1;    }    return Convert.ToInt32(ViewState[viewStateCurrentPageIndex]);   }  }  public int RecordCount  {   get   {    if (ViewState[viewStateRecordCount] == null)    {     ViewState[viewStateRecordCount] = 0;    }    return Convert.ToInt32(ViewState[viewStateRecordCount]);   }   set   {    ViewState[viewStateRecordCount] = value;   }  }  private int TotalNumberOfPages  {   get   {    return RecordCount % PageSize == 0 ? RecordCount / PageSize : (RecordCount / PageSize) + 1;   }  }  protected void Page_Load(object sender, EventArgs e)  {   if (!IsPostBack)   {   }  }  protected void labFirstPage_Click(object sender, EventArgs e)  {   CurrentPageIndex = 1;   this.DataBind();  }  protected void labPreviousPage_Click(object sender, EventArgs e)  {   CurrentPageIndex -= 1;   this.DataBind();  }  protected void labNextPage_Click(object sender, EventArgs e)  {   CurrentPageIndex += 1;   this.DataBind();  }  protected void labLastPage_Click(object sender, EventArgs e)  {   CurrentPageIndex = TotalNumberOfPages;   this.DataBind();  }  protected void btn_Click(object sender, EventArgs e)  {   int pageNum = 1;   bool isNum = Int32.TryParse(txtPageNum.Text, out pageNum);   if (isNum)   {    CurrentPageIndex = Math.Min(pageNum, TotalNumberOfPages);   }   this.DataBind();  }  protected void ddlPageSize_SelectedIndexChanged(object sender, EventArgs e)  {   CurrentPageIndex = 1;   this.DataBind();  }  protected override void DataBind(bool raiseOnDataBinding)  {   BindPager();   base.DataBind(raiseOnDataBinding);   if (OnPageChanged != null)   {    OnPageChanged();   }  }  private void BindPager()  {   labCurrentPageIndex.Text = CurrentPageIndex.ToString();   labTotalNumberOfPages.Text = TotalNumberOfPages.ToString();   labRecordCount.Text = RecordCount.ToString();   SetNavigateEnabled();  }    private void SetNavigateEnabled()  {   txtPageNum.Text = CurrentPageIndex.ToString();   labFirstPage.Enabled = true;   labPreviousPage.Enabled = true;   labNextPage.Enabled = true;   labLastPage.Enabled = true;   labFirstPage.CssClass = "font-blue";   labPreviousPage.CssClass = "font-blue";   labNextPage.CssClass = "font-blue";   labLastPage.CssClass = "font-blue";   if (CurrentPageIndex == 1)   {    labFirstPage.Enabled = false;    labPreviousPage.Enabled = false;    labFirstPage.CssClass = "gray";    labPreviousPage.CssClass = "gray";   }   if (CurrentPageIndex == TotalNumberOfPages)   {    labNextPage.Enabled = false;    labLastPage.Enabled = false;    labNextPage.CssClass = "gray";    labLastPage.CssClass = "gray";   }   if (RecordCount == 0)   {    labFirstPage.Enabled = false;    labPreviousPage.Enabled = false;    labFirstPage.CssClass = "gray";    labPreviousPage.CssClass = "gray";    labNextPage.Enabled = false;    labLastPage.Enabled = false;    labNextPage.CssClass = "gray";    labLastPage.CssClass = "gray";   }  }

当前页码、总共多少条记录使用ViewState记录状态信息，因为导航控件会引起回发刷新。
分页后的数据加载，使用事件。

事件的具体实现放在使用分页控件的具体页面中，进行事件的注册。

测试分页控件的前台页面：

<div style="margin-bottom:10px;">  text:  <asp:TextBox ID="txtContent" runat="server"></asp:TextBox>  <asp:Button ID="btnQuery" runat="server" Text="查 询" OnClick="btnQuery_Click"/> </div> <div>  <asp:GridView ID="gvList" runat="server" Width="99%" AutoGenerateColumns="true"></asp:GridView>  <uc1:PagerControl runat="server" ID="Pager" /></div>

测试分页控件的后台代码：

 private const string dtSourceViewStateKey = "dtSourceViewStateKey"; protected void Page_Load(object sender, EventArgs e) {  if (!IsPostBack)  {  BindData(true);  }  Pager.OnPageChanged += OnPageChanged; } private void BindData(bool bindRecordCount) {  DataTable dtSource = GetDataSource();    var source = dtSource.AsEnumerable();  if (!string.IsNullOrEmpty(txtContent.Text.Trim()))  {  source = source.Where(w => w.Field<string>("text").Contains(txtContent.Text.Trim()));  }  if (bindRecordCount)  {  Pager.RecordCount = source.Count();  Pager.CurrentPageIndex = 1;  Pager.DataBind();  }  gvList.DataSource = source  .Skip((Pager.CurrentPageIndex - 1) * Pager.PageSize)  .Take(Pager.PageSize)  .Select(r => new { id = r["id"].ToString(), text = r["text"].ToString() })  .ToList();  gvList.DataBind(); } private void OnPageChanged() {  BindData(false); } private DataTable InitDataTable() {  DataTable dtSource = new DataTable();  DataColumn id = new DataColumn("id");  id.AutoIncrement = true;  id.AutoIncrementSeed = 1;  dtSource.Columns.Add(id);  dtSource.Columns.Add("text");  for (int i = 1; i <= 1000; i++)  {  DataRow dr = dtSource.NewRow();  dr["text"] = "内容" + i;  dtSource.Rows.Add(dr);  }  return dtSource; } private DataTable GetDataSource() {  if (ViewState[dtSourceViewStateKey] == null)  {  ViewState[dtSourceViewStateKey] = InitDataTable();  }  return ViewState[dtSourceViewStateKey] as DataTable; } protected void btnQuery_Click(object sender, EventArgs e) {  BindData(true); }

在Page_Load中注册翻页后的事件。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。