Bootstrap分页样式 - UrlPager demo

Fork me on GitHub

在线演示

帮助文档

类：
- UrlPager
- RouteValuesExpressionBuilder
属性：
方法：
事件：
- PageChanged

源代码

本示例演示如何为UrlPager应用Bootstrap分页样式。

示例
源码

Order ID	Order Date	Company Name	Customer ID	Employee Name
10867	1998/2/3	Lonesome Pine Restaurant	LONEP	Michael Suyama
10866	1998/2/3	Berglunds snabbköp	BERGS	Steven Buchanan
10865	1998/2/2	QUICK-Stop	QUICK	Andrew Fuller
10864	1998/2/2	Around the Horn	AROUT	Margaret Peacock
10863	1998/2/2	HILARION-Abastos	HILAA	Margaret Peacock

路由定义：

  routes.MapPageRoute("UrlPager_Bootstrap",
                "urlpager/demos/{controller}/{pageIndex}",
                "~/UrlPager/Demos/Bootstrap.aspx", false, new RouteValueDictionary { { "controller", "Bootstrap" }, { "pageIndex", null } }, new RouteValueDictionary { { "controller", "Bootstrap" } });

Bootstrap.aspx:

<%@Register Namespace="Webdiyer.WebControls" Assembly="Webdiyer.UrlPager" TagPrefix="webdiyer"%>
<asp:Repeater ID="Repeater1" runat="server">
    <headertemplate>
    <table class="table table-bordered table-hover">
    <tr><th>Order ID</th><th>Order Date</th><th>Company Name</th><th>Customer ID</th><th>Employee Name</th></tr>
        </headertemplate>
    <itemtemplate>
    <tr>
    <td><%#DataBinder.Eval(Container.DataItem,"orderid")%></td>
    <td><%#DataBinder.Eval(Container.DataItem,"orderdate","{0:d}")%></td>
    <td><%#DataBinder.Eval(Container.DataItem, "companyname")%></td>
    <td><%#DataBinder.Eval(Container.DataItem,"customerid")%></td>
    <td><%#DataBinder.Eval(Container.DataItem,"employeename")%></td>
        </tr>
        </itemtemplate>
    <footertemplate>
        </table>
        </footertemplate>
        </asp:Repeater>
<webdiyer:urlpager containertag="Ul" pagesize="5" numericpageritemcount="8" pageritemtemplate="<li>{0}</li>" CssClass="pagination" CurrentPagerItemTemplate="<li class='active'><a href='#'>{0}</a></li>" id="pager1"
   DisabledPagerItemTemplate="<li class='disabled'><a href='#'>{0}</a></li>" runat="server"  RouteName="UrlPager_Bootstrap"  InheritsRouteValues="true"
   OnPageChanged="PageChanged"></webdiyer:UrlPager>

Bootstrap.aspx.cs:

using System;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
namespace Webdiyer.UrlPagerDemo
{
    public partial class Bootstrap : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
                pager1.TotalItemCount = (int)SqlHelper.ExecuteScalar(CommandType.StoredProcedure, "P_GetOrderNumber");
        }
        protected void PageChanged(object sender, EventArgs e)
        {
            Repeater1.DataSource = SqlHelper.ExecuteReader(CommandType.StoredProcedure, ConfigurationManager.AppSettings["pagedSPName"],
                new SqlParameter("@startIndex", pager1.StartItemIndex),
                new SqlParameter("@endIndex", pager1.EndItemIndex));
            Repeater1.DataBind();
        }
    }
}