twitter-bootstrap 在 asp.net gridview 中应用引导程序分页样式的简单脚本
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22420602/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
simple script to apply bootstrap pagination style in asp.net gridview
提问by Issam Ali
is there any simple jquery script/plugin to apply bootstrap pagination style in asp.net gridview ? I've found some good tips about how to do this, like these links: hereand here. the only problem with these tips/solutions is we need to make a lot of changes to achieve the result and this is not preferable when you have large application and you want to transform it to bootstrap style. we need another solution. like a simple jquery script that can do the job without making lot changes to the current code.
是否有任何简单的 jquery 脚本/插件可以在 asp.net gridview 中应用引导程序分页样式?我找到了一些关于如何做到这一点的好技巧,比如这些链接:here和here。这些提示/解决方案的唯一问题是我们需要进行大量更改才能实现结果,当您拥有大型应用程序并且想要将其转换为引导程序样式时,这不是可取的。我们需要另一种解决方案。就像一个简单的 jquery 脚本,它可以在不对当前代码进行大量更改的情况下完成这项工作。
回答by Issam Ali
I've made simple jquery script to apply the bootstrap pagination in asp.net gridview and I think it will be useful to share it here in stackoverflow. source code of this script is hosted in github here.
我已经制作了简单的 jquery 脚本来在 asp.net gridview 中应用引导程序分页,我认为在 stackoverflow 中分享它会很有用。此脚本的源代码托管在此处的github 中。
usage is very simple:
用法很简单:
-include the plugin js file in your asp.net page file:
- 在您的 asp.net 页面文件中包含插件 js 文件:
<script type="text/javascript" src="js/bs.pagination.js"></script>
-set gridview property:
- 设置 gridview 属性:
PagerStyle-CssClass="bs-pagination"
that's is all you need to apply bootstrap pagination style in asp.net gridview.
这就是在 asp.net gridview 中应用引导程序分页样式所需的全部内容。
check my blogfor more info.
查看我的博客了解更多信息。
Edit:
编辑:
about the problem when using gridview inside UpdatePanel, the reason of this problem is because “UpdatePanel completely replaces the contents of the update panel on an update. This means that those events we subscribed to are no longer subscribed because there are new elements in that update panel.”
关于在UpdatePanel内部使用gridview时出现的问题,这个问题的原因是“UpdatePanel在更新时完全替换了更新面板的内容。这意味着我们订阅的那些事件不再订阅,因为该更新面板中有新元素。”
There is more than one solution to solve this problem:
解决这个问题的方法不止一种:
Solution 1:
解决方案1:
Use pageLoad() instead of $(document).ready. Modify the code like this:
使用 pageLoad() 而不是 $(document).ready。修改代码如下:
function pageLoad() {
$('.bs-pagination td table').each(function (index, obj) {
convertToPagination(obj)
});
}
Solution2:
解决方案2:
re-change the style after every update. We can do this by adding these lines to the bs.pagination.js file:
每次更新后重新更改样式。我们可以通过将这些行添加到 bs.pagination.js 文件来做到这一点:
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function () {
$('.bs-pagination td table').each(function (index, obj) {
convertToPagination(obj)
});
});

