今天要为网站做一个文章列表,发现GridView的分页样式很难看,于是结合网上的例子,自己做了一个。不是很美观,不过还是很实用的,先看下效果吧,如图(1)。

图(1)GridView分页效果

自定义GridView的分页样式,使用的是GridView的  <PagerTemplate>元素。我们先看这段分页代码。

 <PagerTemplate>
<br />
<asp:Label ID="lblPage" runat="server" Text='<%# "第" + (((GridView)Container.NamingContainer).PageIndex + 1) + "页/共" + (((GridView)Container.NamingContainer).PageCount) + "页" %> '></asp:Label>
<asp:LinkButton ID="lbnFirst" runat="Server" Text="首页" Enabled='<%# ((GridView)Container.NamingContainer).PageIndex != 0 %>' CommandName="Page" CommandArgument="First" ></asp:LinkButton>
<asp:LinkButton ID="lbnPrev" runat="server" Text="上一页" Enabled='<%# ((GridView)Container.NamingContainer).PageIndex != 0 %>' CommandName="Page" CommandArgument="Prev" ></asp:LinkButton>
<asp:LinkButton ID="lbnNext" runat="Server" Text="下一页" Enabled='<%# ((GridView)Container.NamingContainer).PageIndex != (((GridView)Container.NamingContainer).PageCount - 1) %>' CommandName="Page" CommandArgument="Next" ></asp:LinkButton>
<asp:LinkButton ID="lbnLast" runat="Server" Text="尾页" Enabled='<%# ((GridView)Container.NamingContainer).PageIndex != (((GridView)Container.NamingContainer).PageCount - 1) %>' CommandName="Page" CommandArgument="Last" ></asp:LinkButton>
到第<asp:TextBox runat="server" ID="inPageNum"></asp:TextBox>页 <asp:Button ID="Button1" CommandName="go" runat="server" />
<br />
</PagerTemplate>
<asp:Label ID="lblPage" runat="server" Text='<%# "第" + (((GridView)Container.NamingContainer).PageIndex + 1)  + "页/共" + (((GridView)Container.NamingContainer).PageCount) + "页" %> '></asp:Label>

这句代码是显示数据供有几页,当前在第几页。我们通过((GridView)Container.NamingContainer).PageIndex来获取当前页,通过((GridView)Container.NamingContainer).PageCount来获取总页数。

<asp:LinkButton ID="lbnFirst" runat="Server" Text="首页"  Enabled='<%# ((GridView)Container.NamingContainer).PageIndex != 0 %>' CommandName="Page" CommandArgument="First" ></asp:LinkButton>

这一句代码实现跳转到列表的第一页,后台代码通过响应GridView.RowCommand 事件,根据CommandName="Page"和CommandArgument="First"来定位到分页列表的第一页。GridView中的任何一个按钮被点击都会触发RowCommand 事件,我们可以通过该事件来自定义处理程序。更多的时候建议使用GridView内置的属性。下表是MSDN上对GridView内置属性的一个简单说明。

CommandName值

说明

“Cancel”

取消编辑操作并将 GridView 控件返回为只读模式。引发 RowCancelingEdit 事件。

“Delete”

删除当前记录。引发 RowDeleting 和 RowDeleted 事件。

“Edit”

将当前记录置于编辑模式。引发 RowEditing 事件。

“Page”

执行分页操作。将按钮的 CommandArgument 属性设置为“First”、“Last”、“Next”、“Prev”或页码,以指定要执行的分页操作类型。引发 PageIndexChanging 和 PageIndexChanged 事件。

“Select”

选择当前记录。引发 SelectedIndexChanging 和 SelectedIndexChanged 事件。

“Sort”

对 GridView 控件进行排序。引发 Sorting 和 Sorted 事件。

“Update”

更新数据源中的当前记录。引发 RowUpdating 和 RowUpdated

在这个自定义分页中,上一页,下一页,尾页和首页都使用了内置属性。

到第<asp:TextBox runat="server" ID="inPageNum"></asp:TextBox>页 <asp:Button ID="Button1" CommandName="go" runat="server" />

这段代码是实现用户自己输入页码,然后点击Button跳转的的前台代码。为了使用RowCommand 事件,我们自定义了CommandName="go",当然你也可以在这里添加 CommandArgument以传递更多的信息。

前台代码就这些,下面我们介绍后台代码。

private void BindGridView()
{
using (BlogDataContext bdc = new BlogDataContext())
{
var artList = bdc.Blog_GetAllCommentationArticles();
Blog_GetAllCommentationArticlesResult g = new Blog_GetAllCommentationArticlesResult(); GridView1.DataSource = artList;
GridView1.DataBind();
}
} protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
try
{
GridView1.PageIndex = e.NewPageIndex;
BindGridView(); TextBox tb = (TextBox)GridView1.BottomPagerRow.FindControl("inPageNum");
tb.Text = (GridView1.PageIndex + ).ToString();
}
catch
{
}
} protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "go")
{
try
{
TextBox tb = (TextBox)GridView1.BottomPagerRow.FindControl("inPageNum");
int num = Int32.Parse(tb.Text);
GridViewPageEventArgs ea = new GridViewPageEventArgs(num - );
GridView1_PageIndexChanging(null, ea);
}
catch
{
}
}
}

这里主要有三个方法, BindGridView()方法,从数据库提取数据绑定到GridView控件。 GridView1_PageIndexChanging方法,在用户单击上一页,下一页,首页,尾页的时候,通过  GridView1.PageIndex = e.NewPageIndex语句来设置GridView控件应该显示的分页数据,然后通过  TextBox tb = (TextBox)GridView1.BottomPagerRow.FindControl("inPageNum"); tb.Text = (GridView1.PageIndex + 1).ToString();语句在Textbox中显示当前页码。

GridView1_RowCommand方法,在这里是响应用户自己输入页码点击Button按钮的事件。首先获取用户输入的页码数,然后调用 GridView1_PageIndexChanging方法,使GridView更新数据

这个例子来源网上,但是没有解释的很清楚的,也许这样的例子不用解释,本人就当画蛇添足了。

GridView自定义分页样式(上一页,下一页,到第几页)的更多相关文章

  1. [ Laravel 5.6 文档 ]laravel数据库操作分页(自定义分页实现和自定义分页样式)

    简介 在其他框架中,分页可能是件非常痛苦的事,Laravel 让这件事变得简单.易于上手.Laravel 的分页器与查询构建器和 Eloquent ORM 集成在一起,并开箱提供方便的.易于使用的.基 ...

  2. ThinkPHP5自定义分页样式

    1.在thinkphp/library/think/paginator/driver目录下新建文件Page.php 注意命名空间和继承 <?php namespace think\paginat ...

  3. TP5之自定义分页样式

    分页样式为 在extend\目录下创建page目录,在page目录下创建Page.php文件,将以下代码放入文件中. <?php namespace page; use think\Pagina ...

  4. Thinkphp5 自定义分页样式显示页码和数量

    Thinkphp5 自带的分页比较简单,本文通过修改Bootstrap类自定义显示分页的页码和数量 一.修改完成后如下图显示 二.修改Bootstrap代码: 1.为了不改动Bootstrap.php ...

  5. 修改DeDe标签Pagelist分页样式,自定义分页样式

    我们在用dede仿站的时候,调用文章列表页的分页时,我们会用到: {dede:pagelist listitem="info,index,end,pre,next,pageno" ...

  6. GridView自定义分页

    CSS样式 首先把CSS样式代码粘贴过来: .gv { border: 1px solid #D7D7D7; font-size:12px; text-align:center; } .gvHeade ...

  7. Laravel自定义分页样式

    <?php namespace App\Http\Controllers; use DB; use App\Http\Controllers\Controller; class UserCont ...

  8. Android中自定义ListView实现上拉加载更多和下拉刷新

    ListView是Android中一个功能强大而且很常用的控件,在很多App中都有ListView的下拉刷新数据和上拉加载更多这个功能.这里我就简单记录一下实现过程. 实现这个功能的方法不止一个,Gi ...

  9. laravel自定义分页功能的实现:

    laravel版本:5.5.. 执行命令: php artisan vendor:publish --tag=laravel-pagination 在到 resources/views/vendor/ ...

随机推荐

  1. 什么是DSCP,如何使用DSCP标记搭配ROS策略

    一.什么是DSCP DSCP:差分服务代码点(Differentiated Services Code Point),IETF于1998年12月发布了Diff-Serv(Differentiated ...

  2. Python 常用PEP8规范

    目录 目录 代码布局 缩进 最大行宽 空行 模块导入 字符串 表达式和语句中的空格 注释 命名规则 编程建议 代码布局 缩进 每级缩进用4个空格. 括号中使用垂直隐式缩进或使用悬挂缩进. EXAMPL ...

  3. javascript创建对象之构造函数模式(二)

    对上一章节的工厂模式进行代码重写 function Human(name, sex) { this.name = name; this.sex = sex; this.say = function ( ...

  4. css选择器, first-child,first-of-type

    选择制定的classname var li = $('.list-tab-group li.active'); <ul class="list-tab-group"> ...

  5. HAproxy目录分发

    ServerA服务的数据查询接口:/api/v1/datas HAproxy地址10.66.222.333将ServerA添加转发规则添加到HAproxyhaproxy.cfg frontend ht ...

  6. 4. 纯 CSS 创作一个金属光泽 3D 按钮特效

    原文地址:https://segmentfault.com/a/1190000014599280 HTML代码: <div class="box">BUTTON< ...

  7. 0_Simple__vectorAdd + 0_Simple__vectorAdd_nvrtc + 0_Simple__vectorAddDrv

    ▶ 使用 CUDA Runtime API,运行时编译,Driver API 三种接口计算向量加法 ▶ 源代码,CUDA Runtime API #include <stdio.h> #i ...

  8. springVC + logback

    为什么用logback,而不是log4j? springmvc log只输出到console,不输出到文件 Spring MVC集成slf4j-logback springMVC如何配置logback ...

  9. Gradle 多项目构建

    Gradle可以轻松处理各种大小规模的项目.小项目由一个单一的构建文件和一个源代码树构成. 大项目可以将其拆分成更小的,相互依赖的模块,以便更容易理解. 多项目构建的结构特征: 在项目的根目录或主目录 ...

  10. $.ajax的重写

    //2018-07-05 项目使用 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success方法 ...