AspNetPager分页控件算是比较好用的一个分页控件了。想要结合bootstrap使用,官方代码入口

.pagination a[disabled]{  color: #777;cursor: not-allowed;background-color: #fff;border-color: #ddd;}
.pagination span.active{z-index: 2;color: #fff;cursor: default;background-color: #337ab7;border-color: #337ab7;}
 <nav class="pull-right">
<webdiyer:AspNetPager ID="dpUsedTemplate" runat="server" OnPageChanged="dpUsedTemplate_PageChanged"
CssClass="pagination" LayoutType="Ul" PagingButtonLayoutType="UnorderedList" PagingButtonSpacing="0" CurrentPageButtonClass="active" PageSize="10">
</webdiyer:AspNetPager>
</nav>

  

发现问题:当数据总数超过30时,会自动出现两个控件,官方说明

解决方案1:

  给两个自动多出来的控件加样式

.pagination input[type=text] { width: 50px !important; display: inline-block; }
.pagination input[type=submit] { margin-left: 10px; }

  

 <nav class="pull-right">
<webdiyer:AspNetPager ID="dpUsedTemplate" runat="server" OnPageChanged="dpUsedTemplate_PageChanged"
CssClass="pagination" LayoutType="Ul" PagingButtonLayoutType="UnorderedList" PagingButtonSpacing="0" CurrentPageButtonClass="active" PageSize="10" PageIndexBoxClass="form-control" SubmitButtonClass="btn btn-primary">
</webdiyer:AspNetPager>
</nav>

  

解决方案二:

  让控件永不多出来

   <nav class="pull-right">
<webdiyer:AspNetPager ID="dpUsedTemplate" runat="server" OnPageChanged="dpUsedTemplate_PageChanged"
CssClass="pagination" LayoutType="Ul" PagingButtonLayoutType="UnorderedList" PagingButtonSpacing="0" CurrentPageButtonClass="active" PageSize="10" ShowPageIndexBox="Never">
</webdiyer:AspNetPager>
</nav>

  

给AspNetPager分页控件添加bootstrap样式的更多相关文章

  1. AspNetPager分页控件

    AspNetPager分页控件解决了分页中的很多问题,直接采用该控件进行分页处理,会将繁琐的分页工作变得简单化,下面是我如何使用AspNetPager控件进行分页处理的详细代码:1.首先到www.we ...

  2. 【转】AspNetPager分页控件用法

    AspNetPager分页控件解决了分页中的很多问题,直接采用该控件进行分页处理,会将繁琐的分页工作变得简单化,下面是我如何使用AspNetPager控件进行分页处理的详细代码: 1.首先到www.w ...

  3. PagedDataSource数据绑定控件和AspNetPager分页控件结合使用列表分页

    1.引用AspNetPager.dll. 2.放置Repeater数据绑定控件. <asp:Repeater ID="Repeater1" runat="serve ...

  4. AspNetPager分页控件的使用方法

    1. 首先将AspNetPager.dll复制于应用程序下的bin目录,打开解决方案,引入dll文件 (通过NuGet获取) 2. 在工具栏中添加控件,这样可以支持拖拽使用 3.页面拖入分页控件,设置 ...

  5. AspNetPager分页控件配置

    AspNetPager是asp.net中常用的分页控件,下载AspNetPager.dll,添加引用,在工具栏就可以看到AspNetPager控件: 拖过来之后,设置如下属性: <webdiye ...

  6. AspNetPager分页控件使用方法

    一.下载AspNetPager.dll 二.AspNetPager.dll复制于应用程序下的bin目录,打开解决方案,引用dll文件 三. 在工具栏中添加控件,这样可以支持拖拽使用 四. 要使用Asp ...

  7. AspNetPager分页控件的使用

    下面所记得东西仅仅是使用方法,详细知识点请看链接:http://www.webdiyer.com/Controls/AspNetPager/Downloads 首先:从网站上下载并安装控件 下载地址: ...

  8. AspNetPager分页控件样式的使用

    分页是Web应用程序中最常用到的功能之一,AspNetPager  简单实用,应用到项目后台中,棒极了! 自定义样式: <style type="text/css"> ...

  9. AspNetPager分页控件官方网站

    原文发布时间为:2009-12-04 -- 来源于本人的百度文章 [由搬家工具导入] http://www.webdiyer.com/AspNetPager

随机推荐

  1. iOS一些推荐的学习路径发展

    iOS论坛里有朋友要求回答帖子,帖子的标题是: 想学IOS开发高阶一点的东西,从何開始,然后我吧啦吧啦回答写了非常多.既然敲了那么多字,我就把我写的回复也贴到博客里来分享.希望能对大家有帮助.欢迎大家 ...

  2. 讨论asp.net通过机器cookie仿百度(google)实现搜索input搜索提示弹出框自己主动

    为实现自己主动弹出通过用户输入关键词相关的搜索结果,在这里,我举两个解决方案,对于两个不同的方案. 常用的方法是建立一个用户数据库中查找关系表.然后输入用户搜索框keyword异步调用数据表中的相关数 ...

  3. hdu1506(dp减少重复计算)

    可以算出以第i个值为高度的矩形可以向左延伸left[i],向右延伸right[i]的长度 那么答案便是 (left[i] + right[i] + 1) * a[i] 的最大值 关键left[i] 和 ...

  4. spoj Balanced Numbers(数位dp)

    一个数字是Balanced Numbers,当且仅当组成这个数字的数,奇数出现偶数次,偶数出现奇数次 一下子就相到了三进制状压,数组开小了,一直wa,都不报re, 使用记忆化搜索,dp[i][s] 表 ...

  5. Eclipse4.4.2手动安装Veloeclipse-2.0.8

    引言:     新安装了Eclipse最新版本 4.4.2 Luna(月神),由于项目中使用到了模板引擎Velocity,所以想安装一个Velocity插件, 在网上找了一下,看到Google的vel ...

  6. elasticsearch2.2

    elasticsearch2.2 集群搭建各种坑     目前生产环境的es版本是1.0版本,需要升级到最新的2.2版本,于是在测试环境进行部署集群测试,在测试过程中遇到的坑相当多,下面详细介绍下. ...

  7. 查看hadoop管理页面,修改本地hosts,Browse the filesystem

    问题: hadoop管理界面,ip:50070,中点击Browse the filesystem会出现网页无法访问,看地址栏,是集群中的主机名::50075/browseDirectory.jsp?n ...

  8. 创Wcf案例数据服务

    首先,创建实体类: using System; using System.Linq; using System.Collections.Generic; using System.Data.Servi ...

  9. 每天进步一点点——再次了解Linux进程ID

    转载请注明出处:http://blog.csdn.net/cywosp/article/details/38968011 1. 概述 众所周知,进程(process)是一个可运行程序的实例,可是在Li ...

  10. 升级 树莓派的gcc/g++编译器到4.8

    首先,更新你的树莓派(避免编译出来版本不对导致不能insert)sudo apt-get update sudo apt-get upgrade sudo apt-get dist-upgrade s ...