Bootstrap实现刷新table的方法哪些
导读：这篇文章主要给大家介绍“Bootstrap实现刷新table的方法哪些”的相关知识，下文通过实际案例向大家展示操作过程，内容简单清晰，易于学习，有这方面学习需要的朋友可以参考，希望这篇“Bootstrap实现刷新table的方法哪些”文章能...
这篇文章主要给大家介绍“Bootstrap实现刷新table的方法哪些”的相关知识，下文通过实际案例向大家展示操作过程，内容简单清晰，易于学习，有这方面学习需要的朋友可以参考，希望这篇“Bootstrap实现刷新table的方法哪些”文章能对大家有所帮助。本篇文章给大家介绍一下bootstrapTable刷新（重新加载数据）的3种方式。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
项目中使用到了bootstrapTable ， 根据条件查询数据，重新加载列表，有几种方式。
直接看代码：
$(function() {
load();
}
);
function load() {
$('#dataTable').bootstrapTable(
{
method : 'post',
url : "/user/list",
pageSize : 10,
pageNumber : 1,
sidePagination : "server",
queryParams : function(params) {
return {
limit: params.limit,
offset: params.offset,
userName: $.trim( $('#userName').val() ) ,
age: $.trim( $('#age').val() ) ,
}
}
,
columns : [
{
checkbox : true
}
,
{
field : 'userName',
title : '名称' ,
}
,
{
field : 'age',
title : '年龄' ,
}
,
{
field : 'createDate',
title : '创建时间' ,
}
,
{
title : '操作',
field : 'id',
formatter : function(value, row, index) {
return '' ;
}
}
]
}
);
}
// 方法1： 刷新（重新加载数据）
function reLoad() {
$('#dataTable').bootstrapTable('destroy');
load();
}
// 方法2： 刷新（重新加载数据）
function reLoad2() {
$("#dataTable").bootstrapTable('refreshOptions',{
pageNumber:1}
);
// pageNumber:1, 指定页码为第1页
$("#dataTable").bootstrapTable('refresh');
}
// 方法3（推荐）： 跳转到第1页（包含查询和重新加载）
function reLoad3() {
$("#dataTable").bootstrapTable('selectPage', 1);
}
说明：
方法1、方法2 是将 table销毁销毁，再生成新的列表；由于 table销毁，使得每次页面会滚动最上面。
方法3 是跳转到第1页 ，页面不会滚动，体验会更好 。但是当查询列表数据为空时，方法失效。
到此这篇关于“Bootstrap实现刷新table的方法哪些”的文章就介绍到这了，感谢各位的阅读，更多相关Bootstrap实现刷新table的方法哪些内容，欢迎关注网络资讯频道，小编将为大家输出更多高质量的实用文章！
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： Bootstrap实现刷新table的方法哪些
本文地址： https://pptw.com/jishu/654846.html