BootstrapTable刷新后/重新加载后跳到原页码的界面

7 篇文章 0 订阅
2 篇文章 0 订阅
BootstrapTable确实好用,这是我的感受,必须先鼓掌赞扬!

遇到的问题:
当我跳转到某页,修改一条记录的内容,保存后刷新页码,默认是调到BootstrapTable的第1页的界面。而我想跳转到刷新前所在的原页码的界面。好像下图所示,我想刷新后自动跳回BootstrapTable的第3页。
上图所示是我想刷新后自动跳到第3页

注明:我用“界面”一词,是因为起始BootstrapTable是所有数据都加载完毕,再进行分页展示,所以跳转到某个“页面”其实并不是“页面”。

由于遇到此问题,我就上网寻找方法。解决此问题,需要用到几个知识点,涉及到多个帖子。
因此,我将方法总结、并用自己的语言记录思路和步骤,希望大家批评指正:

简单来说就是以下4步
  1. 刷新的时候指定本页的地址作为跳转地址
  2. 在跳转的本页地址中添加表格页码作为参数
  3. 刷新后获取附在地址中的页码参数
  4. 使用BootstrapTable的官方方法使表格跳转
1.刷新的时候指定本页的地址作为跳转地址

举例说明,比如用jQuery等写的跳转代码一般是

window.location.reload();

需要传参则必须用本页的地址,如下

window.location.href = "<%=basePath%>flowwithrecord/list.action";

上面代码中引号的部分是根据实际情况的页面地址

2.在跳转的本页地址中添加表格页码作为参数

在第1步的页面地址中添加表格当前页码。
地址中“?”后是跟着参数名,然后“=”号后是跟参数值,这样的一个键值对的关系。参数键值对之间用“&”隔开。而这里只有一个参数,在jQuery代码中声明为pg。此BootstrapTable的ID是“tableFlows”。综上,就有了以下的代码了。

	var $tableFlows = $('#tableFlows');
	var pg = $tableFlows.bootstrapTable('getOptions').pageNumber;  //获取当前页码
	window.location.href = "<%=basePath%>flowwithrecord/list.action?tablePage=" + pg;
3.刷新后获取附在地址中的页码参数

其中location.search是本页的带参数地址,赋值给paraString;
tablePage则是从页面地址中获取的页码参数;
selectPage系BootstrapTable的一个方法,页码用parseInt方法进行处理变为整数类型,不然翻页控件会失灵。
代码见第4步下面的。

4.使用BootstrapTable的selectPage方法使表格跳转
window.onload=function(){
	// 获取之前停留的页面页码
	var paraString = location.search;
	var tablePage = paraString.substr(paraString.indexOf("=") + 1);
	
	// 跳转到对应的页面
	var $tableFlows = $('#tableFlows');	    
    $tableFlows.bootstrapTable('selectPage', parseInt(tablePage));
}
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值