本文摘自PHP中文网,作者angryTom,侵删。

项目中在使用到bootstrap-table的时候,修改完数据之后应该停留在当前页,但是通常会跳转到我们初始化时定义的默认页上去,这里我们介绍如何实现数据刷新后停留在当前页。
推荐教程:Bootstrap入门教程
获取当前页
要想停留在当前页,我们首先需要获取当前页。bootstrap-table定义了getOptions可以获取到非常多的表格信息,其中就包括当前页。
1 | $table.bootstrapTable( 'getOptions' )
|

重新请求数据
我们修改完数据以后需要重新请求数据,可以使用refresh或者再次进行初始化调用,我这里使用了再次进行初始化调用。通过将当前页作为参数传递进去。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | 通过调用初始化函数刷新数据
init(pageIndex);
function init(pageIndex){
$( '#table' ).bootstrapTable({
method: 'get' ,
url: '/admin/student/getAllStudent' ,
striped: true ,
cache: false ,
uniqueId: 'id' ,
clickToSelect: true ,
pagination: true ,
pageNumber:pageIndex || 1,
queryParams : queryParams,
sidePagination: 'server' ,
pageSize:10,
pageList:[10,20,30,40],
columns: [{
field: 'sid' ,
title: 'sid' ,
}, {
field: 'name' ,
title: 'name'
}, {
field: 'grade' ,
title: 'grade'
},{
field: 'password' ,
title: 'password'
},{
field: 'Button' ,
title: '操作' ,
events: operateEvents,
formatter:AddFunctionAlty
},
]
});
}
|
总结
实现数据刷新后停留在当前页,是我们经常会遇到的问题,这里简单地记录了实现方法。也许有更加简单的方法。
想要免费下载bootstrap模板,可访问 bootstrap模板 栏目!
以上就是bootstrap-table数据刷新后留在当前页的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
react和bootstrap区别
为什么要使用bootstrap框架
bootstrap能开发移动端吗
bootstrap怎么关闭弹出层
如何使用bootstrap制作form表单
为什么要使用bootstrap
easyui和bootstrap之间有什么区别?
bootstrap用什么开发工具
bootstrap是哪个组织创建的
如何用bootstrap定义上弹菜单
更多相关阅读请进入《bootstrap》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » bootstrap-table数据刷新后留在当前页