重置jquery分页插件中的总页数

我正在使用TwbsPagination插件在我的应用程序中显示分页。 我们在初始化时设置页面大小时工作正常。 但是，根据搜索结果，我想重置总页数。

当我尝试使用时

$('#pagination').twbsPagination({totalPages:10}); 

它没有重置显示的总页数。

Answer 1

我面临着同样的问题，我正在为解决方案而烦恼但却一无所获。 因此，在分析了脚本代码之后，我知道这个脚本使用.data（）方法来保存分页的视图状态，并且我设法明确地完成了它。

.data（）：存储与匹配元素关联的任意数据，或者在指定数据存储中返回匹配元素集中第一个元素的值。 参考： http ： //api.jquery.com/data/

重置分页的解决方案。

你只需要在“列表渲染”或“数据绑定”function/方法之前调用

$（ ‘＃分页’）空（）;

$（ ‘＃分页’）removeData（ “拼焊板-分页”）。

$（ ‘＃分页’）解除绑定（ “页”）;

这将重置分页的视图状态数据。 （ “twbs-pagination”是视图状态键 ）。

希望这可以帮助。

Answer 2

啊，我设法以不同的方式完成这项工作。 由于我将此与JQGrid结合使用，因此我选择了loadComplete事件来修补我的代码。 这里是步骤：

1.创建一个DIV来保持分页按钮（twbs控制）

2.创建一个本地js变量来保存当前页面

 var currentPage=1; 

3.在JQgrid的AJAX之前更新页码

 beforeRequest: function () { var postData = grid.jqGrid('getGridParam', "postData"); postData.page = currentPage; postData.rows = $("#rows").val(); } 

4.在loadComplete上重建分页控件。 当用户点击页面时，我正在更新页码（ currentPage ）并重新加载网格。

 loadComplete: function (data) { $('#paginationholder').html(''); $('#paginationholder').html('
'); $('#pagination').twbsPagination({ startPage: data.page, totalPages: data.total, visiblePages: 5, onPageClick: function (event, page) { currentPage = page; grid.trigger('reloadGrid'); } }); } 

Answer 3

你可以利用destroy 。 看到这里 。

所以：

$('#pagination').twbsPagination('destroy');

然后重新初始化它：

$('#pagination').twbsPagination({totalPages:5});

小提琴

Answer 4

阅读twbs-pagination源代码

这里说明为什么你没有重置总页面：

  var data = $this.data('twbs-pagination'); if (!data) $this.data('twbs-pagination', (data = new TwbsPagination(this, options) )); 

Viewstate param twbs-pagination存在，因此您无法重新渲染。

这是删除viewstate的解决方案：

 TwbsPagination.prototype = { destroy: function () { this.$element.empty();//remove child nodes this.$element.removeData('twbs-pagination');//remove viewstate this.$element.off('page');//unbind $(this) node from page return this; }, 

所以你可以调用destroy方法@Robin Carlo Catacutan

或者手动执行内部方法@Vipin Kohli

Answer 5

破坏方法对我不起作用（1.4.1），通过查看源代码，我发现有2个关键点使其正确地重新实例化。

1. pagination.data（ ‘拼焊板-pagination.js’，NULL）;
2. 实例化参数startPage必须是int类型而不是String类型

上面显示了我的部分代码，希望它可以帮助您：

 $('.unstyled > li >a').on('click', function (e) { e.preventDefault(); pagination.data('twbs-pagination.js',null); loadPage(1,$(e.target).attr('categoryId')); }); function initilizePagination(totalPages,currentPage,blogCategory){ pagination.twbsPagination({ initiateStartPageClick: false, totalPages: totalPages, startPage: currentPage, onPageClick: function (event, page) { loadPage(page, blogCategory); } }); pagination.twbsPagination({render:currentPage}); } function loadPage(page,blogCategory) { $.ajax("url", { method: "get", success: function (data) { $("#blogListWrapper").html(data); var ajaxPageCount = $('#ajaxPageCount').val(); var ajaxPageNo = parseInt($('#ajaxPageNo').val()); initilizePagination(ajaxPageCount,ajaxPageNo,blogCategory); } } ); }