扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
<%@ Register Assembly="Winson.WControls" Namespace="Winson.SqlPager" TagPrefix="SqlPager" %> |
2、在需要放置分页控件的地方,插入以下代码:
<SqlPager:SqlPager ID="SqlPager1" runat="server" ControlToPaginate="GridView1" Width="700" ItemsPerPage="4" BorderStyle=Dotted BackColor="#ffffff" PagerStyle=CustomAndNumeric FirstButton="第一页" PrveButton="上一页" NextButton="下一页" LastButton="最后一页" PagingMode="Cached" ></SqlPager:SqlPager> |
基本参数说明:
ID:即本分页控件的自身ID
ControlToPaginate:分页控件需绑定的数据源控件的ID,本例中数据源控件为GridView
BorderStyle:分页控件边框样式,本例中为虚线
PagerStyle:即分页按钮的样式,此为一个枚举参数,同时也是设置是否使用AJAX的参数,以下将会有详细说明
PagingMode:是否使用Cached,如果使用NonCached则只读取对当前页面数据,如为Cached,则一次性读取所有数据然后进行分页,建议数据量少时使用NonCached,但如果想与Tab控件配合使用,则必须要使用Cached模式
以下为分页按钮的自定义样式,只有当PagerStyle设置为自定义样式时才生效
FirstButton:第一页的按钮样式
PrveButton:上一页的按钮样式
NextButton:下一页的按钮样式
LastButton:最后一页的按钮样式
3、以上代码配置好后,即可在后台为分页控件设置数据源,当然在前台也可以直接用参数设置
设置数据源有2种方式,一种是直接在前台使用SelectCommand参数进行设置,如将以下语句直接加到控件标签里
<SqlPager:SqlPager SelectCommand = "select * from Employees" ></SqlPager:SqlPager>
另一种方式是可以使用自定义的数据源,如DataSet,但在使用自定义数据源之前,需将参数UseCustomDataSource设置为true,如下代码:
SqlPager1.UseCustomDataSource = true;
SqlPager1.CustomDataSource = DBOP.ExecuteDataset("select * from Employees ", "ds");
SqlPager1.DataBind();
以上方式只能在后台执行。需要注意的是,不管哪种方式,最后都必须在后台调用DataBind()方法。
四、高级应用
1、使用AJAX分页:
本控件支持AJAX分页,但还必须写一些客户端的代码,相关的客户端代码我已在DEMO里有啦,具体可以打开PagerDemo.aspx文件查看,在需要分页的页面上添加以下JS代码:
function setPageTo(pageIndex) { var context=document.getElementById("listDIV"); context.innerHTML="数据加载中"; var arg=pageIndex; <%= ClientScript.GetCallbackEventReference(this, "arg", "onCallServerComplete", "context")%>; } function onCallServerComplete(result,context) { context.innerHTML=result; } |
然后在后台添加相应的AJAX方法,建议使用我DEMO里的方式,将这些代码添加到一个基类页面里,然后各页面继承来用,请看我的BasePage.cs文件,即以下代码:
Ajax分页处理#region Ajax分页处理
//引发回调事件处理 public void RaiseCallbackEvent(string eventArgument) { serverReturn = eventArgument; } //回传回调结果 public string GetCallbackResult() { return PageChange(serverReturn); } /**//**//**//// <summary> /// 执行分页操作 /// </summary> /// <param name="newIndex">新页面的索引</param> /// <returns>需显示的页面数据</returns> private string PageChange(string newIndex) { int newPageIndex = int.Parse(newIndex); SqlPagerBase.GoToPage(newPageIndex); return GetRenderCode(); } /**//**//**//// <summary> /// 将读取的数据呈现在客户端 /// </summary> /// <returns></returns> private string GetRenderCode() { StringWriter writer1 = new StringWriter(System.Globalization.CultureInfo.InvariantCulture); HtmlTextWriter writer2 = new HtmlTextWriter(writer1); if (GridViewBase != null) { GridViewBase.Visible = true; GridViewBase.RenderControl(writer2); } else if (RepeaterBase != null) { RepeaterBase.Visible = true; RepeaterBase.RenderControl(writer2); } else if (DataListBase != null) { DataListBase.Visible = true; DataListBase.RenderControl(writer2); } else if (ListBase != null) { ListBase.Visible = true; ListBase.RenderControl(writer2); } SqlPagerBase.RenderControl(writer2); writer2.Flush(); writer2.Close(); return writer1.ToString(); } #endregion |
注意,如果你要将以上代码放到独立页面,必须要先继承System.Web.UI.ICallbackEventHandler接口!
编写完以上代码后,再需将SqlPager里的PagerStyle属性设置为以Ajax开头的类型,以下是PagerStyle属性各参数的说明:
**/**///// <summary> /// 页面样式设置 /// </summary> public enum PagerStyle { /**//**//**//// <summary> /// 按钮样式为上下页箭头 /// </summary> NextPrev, /**//**//**//// <summary> /// 按钮样式来下拉框页码 /// </summary> NumericPages, /**//**//**//// <summary> /// 按钮和下拉框页码一起显示 /// </summary> NextAndNumeric, /**//**//**//// <summary> /// 自定义样式,可自定文本 /// </summary> CustomStyle, /**//**//**//// <summary> /// 自定义样式,可自定文本,同时显示下拉页码 /// </summary> CustomAndNumeric, /**//**//**//// <summary> /// 无刷新箭头式按钮 /// </summary> AjaxNext, /**//**//**//// <summary> /// 无刷新箭头式按钮加下拉页码 /// </summary> AjaxNextAndNum, /**//**//**//// <summary> /// 无刷新下拉框按钮 /// </summary> AjaxNumeric, /**//**//**//// <summary> /// 自定义无刷新分页 /// </summary> AjaxCustomPages, /**//**//**//// <summary> /// 自定义无刷新和下拉框页码 /// </summary> AjaxCustomAndNumeric } |
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。
现场直击|2021世界人工智能大会
直击5G创新地带,就在2021MWC上海
5G已至 转型当时——服务提供商如何把握转型的绝佳时机
寻找自己的Flag
华为开发者大会2020(Cloud)- 科技行者