asp.net webform怎么自定义分页控件的方法

作者：袖梨 2022-06-25

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

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

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

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

 
 代码如下 复制代码
 .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;
 }
 当前/页
 共条记录
 
  首页
  |
  上一页
  |下一页
  |尾页
 
 跳至1页
  
 
  
   
   
   
   
   
  条/每页

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

privateconststringviewStateCurrentPageIndex ="CurrentPageIndex";
  privateconststringviewStateRecordCount ="RecordCount";
 
  publicdelegatevoidPageChangedHandle();
  publiceventPageChangedHandle OnPageChanged;
 
  publicintPageSize
  {
   get
   {
    returnConvert.ToInt32(ddlPageSize.SelectedValue);
   }
  }
 
  publicintCurrentPageIndex
  {
   set
   {
    ViewState[viewStateCurrentPageIndex] = value;
   }
   get
   {
    if(ViewState[viewStateCurrentPageIndex] ==null)
    {
     ViewState[viewStateCurrentPageIndex] = 1;
    }
 
    returnConvert.ToInt32(ViewState[viewStateCurrentPageIndex]);
   }
  }
  publicintRecordCount
  {
   get
   {
    if(ViewState[viewStateRecordCount] ==null)
    {
     ViewState[viewStateRecordCount] = 0;
    }
 
    returnConvert.ToInt32(ViewState[viewStateRecordCount]);
   }
   set
   {
    ViewState[viewStateRecordCount] = value;
   }
  }
  privateintTotalNumberOfPages
  {
   get
   {
    returnRecordCount % PageSize == 0 ? RecordCount / PageSize : (RecordCount / PageSize) + 1;
   }
  }
 
  protectedvoidPage_Load(objectsender, EventArgs e)
  {
   if(!IsPostBack)
   {
 
   }
  }
 
  protectedvoidlabFirstPage_Click(objectsender, EventArgs e)
  {
   CurrentPageIndex = 1;
 
   this.DataBind();
  }
 
  protectedvoidlabPreviousPage_Click(objectsender, EventArgs e)
  {
   CurrentPageIndex -= 1;
 
   this.DataBind();
  }
 
  protectedvoidlabNextPage_Click(objectsender, EventArgs e)
  {
   CurrentPageIndex += 1;
 
   this.DataBind();
  }
 
  protectedvoidlabLastPage_Click(objectsender, EventArgs e)
  {
   CurrentPageIndex = TotalNumberOfPages;
 
   this.DataBind();
  }
 
  protectedvoidbtnGo_Click(objectsender, EventArgs e)
  {
   intpageNum = 1;
   boolisNum = Int32.TryParse(txtPageNum.Text,outpageNum);
   if(isNum)
   {
    CurrentPageIndex = Math.Min(pageNum, TotalNumberOfPages);
   }
 
   this.DataBind();
  }
 
  protectedvoidddlPageSize_SelectedIndexChanged(objectsender, EventArgs e)
  {
   CurrentPageIndex = 1;
 
   this.DataBind();
  }
 
  protectedoverridevoidDataBind(boolraiseOnDataBinding)
  {
   BindPager();
   base.DataBind(raiseOnDataBinding);
 
   if(OnPageChanged !=null)
   {
    OnPageChanged();
   }
  }
 
  privatevoidBindPager()
  {
   labCurrentPageIndex.Text = CurrentPageIndex.ToString();
   labTotalNumberOfPages.Text = TotalNumberOfPages.ToString();
   labRecordCount.Text = RecordCount.ToString();
 
   SetNavigateEnabled();
  } 
 
  privatevoidSetNavigateEnabled()
  {
   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记录状态信息，因为导航控件会引起回发刷新。
分页后的数据加载，使用事件。

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

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

 
 代码如下 复制代码
  text:
  
  
 
 
  
  
 

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

 
 代码如下 复制代码
privateconststringdtSourceViewStateKey ="dtSourceViewStateKey";
 
protectedvoidPage_Load(objectsender, EventArgs e)
{
 if(!IsPostBack)
 {
 BindData(true);
 
 }
 Pager.OnPageChanged += OnPageChanged;
}
 
privatevoidBindData(boolbindRecordCount)
{
 DataTable dtSource = GetDataSource();
  
 
 var source = dtSource.AsEnumerable();
 if(!string.IsNullOrEmpty(txtContent.Text.Trim()))
 {
 source = source.Where(w => w.Field("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();
}
 
privatevoidOnPageChanged()
{
 BindData(false);
}
 
privateDataTable InitDataTable()
{
 DataTable dtSource =newDataTable();
 DataColumn id =newDataColumn("id");
 id.AutoIncrement =true;
 id.AutoIncrementSeed = 1;
 
 dtSource.Columns.Add(id);
 dtSource.Columns.Add("text");
 
 for(inti = 1; i <= 1000; i++)
 {
 DataRow dr = dtSource.NewRow();
 dr["text"] ="内容"+ i;
 
 dtSource.Rows.Add(dr);
 }
 
 returndtSource;
}
 
privateDataTable GetDataSource()
{
 if(ViewState[dtSourceViewStateKey] ==null)
 {
 ViewState[dtSourceViewStateKey] = InitDataTable();
 }
 
 returnViewState[dtSourceViewStateKey]asDataTable;
}
 
protectedvoidbtnQuery_Click(objectsender, EventArgs e)
{
 BindData(true);
}

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

相关文章

精彩推荐