GridView自定义分页

在.NET平台下处理显示数据时,需要经常使用GridView控件进行分页,虽然它本身提供了分页机制,但总的说来其分页效果较为单调,大部分情况下无法满足客户的需求(也只能让开发人员YY一下而已)。与此同时,GridView提供了多种扩展机制,用户可以在此基础上自行扩展分页功能。现在就对其分页进行相应的扩展
首先,对GridView控件添加一个PagerTemplate,其HTML代码如下所示。

<asp:GridView ID="GridView1" runat="server"
AllowPaging="True" PageSize="5"
OnDataBound = "GridView_DataBind" CellPadding=2 CellSpacing=0>
<PagerTemplate>
<div id="main">
<div id="info">  页次:<asp:Label ID="lblPageCurrent" runat="server" Text="1" CssClass="txtInfo"></asp:Label>
/<asp:Label ID="lblPageCount" runat="server" Text="1"></asp:Label>  
共 <asp:Label ID="lblPageRow" runat="server" Text="1" CssClass="txtInfo"></asp:Label> 条记录
</div>
<div id="page">
<asp:LinkButton ID="btnFirst" runat="server" CssClass="link" CommandName="Pager" CommandArgument="First" OnCommand="NavigateToPage">[首页]</asp:LinkButton> 
<asp:LinkButton ID="btnPrev" runat="server" CssClass="link" CommandName="Pager" CommandArgument="Prev" OnCommand ="NavigateToPage">[前一页]</asp:LinkButton> 
<asp:LinkButton ID="btnNext" runat="server" CssClass="link" CommandName="Pager" CommandArgument="Next" OnCommand="NavigateToPage">[下一页]</asp:LinkButton> 
<asp:LinkButton ID="btnLast" runat="server" CssClass="link" CommandName="Pager" CommandArgument="Last" OnCommand="NavigateToPage">[尾页]</asp:LinkButton>  
</div>
</div>
</PagerTemplate>
<RowStyle BackColor="#F9F9F9" />
<HeaderStyle BackColor="#EDF7E7" Font-Bold="true" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>



添加的三个Label(lblPageCurrent,lblPageCount,lblPageRow)控件分别用来显示当前页、总页数及总记录数。添加的四个LinkButton控件用来导航。控件准备好之后,就开始写代码,首先需要完成GridView控件的OnDataBound事件(GridView_DataBind),再次需要完成LinkButton的Command事件(NavigateToPage)这一步主要用来导航。其具体代码如下所示。

public partial class Default : System.Web.UI.Page
{
int rowCount = 0;//用来记录总记录数
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
GridViewFill();
}
private void GridViewFill()
{
string strConn = "server=localhost\\sqlexpress;database=MyComics;Integrated Security=True";
SqlConnection conn = new SqlConnection(strConn);
DataSet ds = new DataSet();
string strSql = "SELECT * FROM Books";
SqlDataAdapter DA = new SqlDataAdapter(strSql, conn);
DA.Fill(ds, "Books");
rowCount = ds.Tables["Books"].Rows.Count; //取得总记录数目
this.GridView1.DataSource = ds.Tables["Books"];
this.GridView1.DataBind();
}
protected void NavigateToPage(object sender, CommandEventArgs e)
{
//控制转页
switch (e.CommandArgument.ToString())
{
case "First":
this.GridView1.PageIndex = 0;
break;
case "Prev":
if (this.GridView1.PageIndex > 0)
this.GridView1.PageIndex -= 1;
break;
case "Next":
if (this.GridView1.PageIndex < (this.GridView1.PageCount - 1))
this.GridView1.PageIndex += 1;
break;
case "Last":
this.GridView1.PageIndex = this.GridView1.PageCount - 1;
break;
}
GridViewFill();
}
protected void GridView_DataBind(object sender, EventArgs e)
{
GridViewRow pagerRow = GridView1.BottomPagerRow;
//获取Label实例,显示页次信息
Label lblCurrent = (Label)pagerRow.Cells[0].FindControl("lblPageCurrent");
Label lblCount = (Label)pagerRow.Cells[0].FindControl("lblPageCount");
Label lblRow = (Label)pagerRow.Cells[0].FindControl("lblPageRow");
//获取按钮实例,为了控制其是否可用
LinkButton btnFirstTem = (LinkButton)pagerRow.Cells[0].FindControl("btnFirst");
LinkButton btnPrevTem = (LinkButton)pagerRow.Cells[0].FindControl("btnPrev");
LinkButton btnNextTem = (LinkButton)pagerRow.Cells[0].FindControl("btnNext");
LinkButton btnLastTem = (LinkButton)pagerRow.Cells[0].FindControl("btnLast");

if (lblCurrent != null)
lblCurrent.Text = (this.GridView1.PageIndex + 1).ToString();
if (lblCount != null)
lblCount.Text = this.GridView1.PageCount.ToString();
if (lblRow != null)
lblRow.Text = rowCount.ToString();

if (this.GridView1.PageIndex == 0)
{
btnFirstTem.Enabled = false;
btnPrevTem.Enabled = false;
//只有一页,所有分页按钮不可用
if (this.GridView1.PageCount == 1)
{
btnNextTem.Enabled = false;
btnLastTem.Enabled = false;
}
}
else if (this.GridView1.PageIndex == (this.GridView1.PageCount - 1))
{
btnNextTem.Enabled = false;
btnLastTem.Enabled = false;
}
}
}



OK,现在就可以使用我们自定义的分页了,目前网络上使用的分页大部分都是这种样子,因此在进行样式设计时,就直接按照这种模式设计了。其中在控制外观时,使用了一个样式表,其具体代码如下所示。

body
{
font-size:9pt;
}
#main
{
background-color:#EDF7E7;
line-height:30px;
width:100%;
text-align:left;
}
#info
{
width: 40%;
font-family: Verdana;
float:left;
text-align:left;
}
#page
{
width:60%;
float:left;
overflow:auto;
text-align:right;
}
.txtInfo
{
color:#e78a29;
}
.link
{
text-decoration:none;
color:#474747;
}



导航按钮我使用了LinkButton控件,也可以使用ImageButton控件,这样就可以使用自己绘制的图片作为当航提示,从而避免只有文字的光秃效果。

另外,我在计算记录的总数目时,使用的是rowCount = ds.Tables["Books"].Rows.Count这种方法,我一直在想GridView控件应该也能够提供一种获取总记录的方法,只可惜在我写这篇文章时,一直没有发现。那位高手懂得,还望赐教~~~~~~~~~~~~~~~~。Rayshow在此谢过...
转自:http://hi.baidu.com/rayshow/blog/item/aa10248ba5ef8b10c9fc7a67.html
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值