GridView分页,使用自带分页功能,类似下面样式:
在aspx页面中,GridView上的PagerStyle下CssClass属性,设置为bubufxPagerCss,具体aspx页面代码:
<asp:GridView ID="GridView1" runat="server" Width="100%" AutoGenerateColumns="False" AllowPaging="True" EmptyDataText="没有数据记录!!" OnPageIndexChanging="GridView1_PageIndexChanging" ShowHeader="False" GridLines="None"> <Columns> <asp:BoundField DataField="ID" HeaderText="ID" /> <asp:BoundField DataField="name" HeaderText="name" /> <asp:BoundField DataField="card" HeaderText="card" /> <asp:TemplateField ItemStyle-HorizontalAlign="right" ItemStyle-CssClass="list" ItemStyle-Width="100"> <ItemTemplate> <%# Eval("ctime", "{0:yyyy-MM-dd}")%> </ItemTemplate> </asp:TemplateField> </Columns> <PagerSettings FirstPageText="首页" LastPageText="末页" NextPageText="下一页" PageButtonCount="5" PreviousPageText="上一页" Mode="NumericFirstLast" /> <PagerStyle BorderColor="#66FF66" Font-Names="宋体" Font-Size="12px" HorizontalAlign="Center" CssClass="bubufxPagerCss" /> </asp:GridView>
aspx.cs代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data.OleDb; using System.Data; public partial class list : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { dataBind(); } } private void dataBind() { string sql = "select * from tt "; try { DataTable DT = new DataTable(); // string connStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("db.mdb"); OleDbConnection conn = new OleDbConnection(connStr); if (conn.State == ConnectionState.Closed) conn.Open(); OleDbDataAdapter da = new OleDbDataAdapter(sql, conn); da.Fill(DT); conn.Close(); // GridView1.DataSource = DT; GridView1.DataBind(); } catch (Exception ex) { Response.Write("数据库错误,错误原因:" + ex.Message); Response.End(); } } protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e) { GridView1.PageIndex = e.NewPageIndex; dataBind(); } }
css代码:
.bubufxPagerCss table { text-align:center; margin:auto; } .bubufxPagerCss table td { border:0px; padding:5px; } .bubufxPagerCss td { border-left: #ffffff 3px solid; border-right: #ffffff 3px solid; border-bottom: #ffffff 3px solid; } .bubufxPagerCss a { color:#231815;text-decoration:none;padding:3px 6px 3px 6px; margin: 0 0 0 4px; text-align:center; border:1px solid #ac1f24; } .bubufxPagerCss span { color:#fefefe;background-color:#ac1f24; padding:3px 6px 3px 6px; margin: 0 0 0 4px; text-align:center; font-weight:bold; border:1px solid #ac1f24; }这样就实现自带分页的页码样式了。