bootstrapTable查询时分页页数不初始化问题

在用bootstrapTable时遇到一个问题:如果在列表中点击下一页到第二页数据,然后再查询时,数据默认会显示第二页数据,如果数据达不到两页,页面就会显示空白。

解决:将表格加载写为一个方法,在查询时,不调用表格的刷新方法,而是销毁表格,然后再次调用表格的加载方法。

代码如下:

$(function(){
	oTableInit();
})
function oTableInit(){
	$table.bootstrapTable({
		url: "${base}/role/getRoleList", 
	    dataType: "json",
	    singleSelect: false,
	    striped: true, //是否显示行间隔色
	    cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
	    sortable: true, //是否启用排序 
	    pagination: true,	//显示分页按钮
	    sortName:"create_time",
	    sortOrder:"desc", //默认排序
	    pageNumber: 1, //初始化加载第一页,默认第一页
	    pageSize: 10, 	//默认显示的每页个数
	    pageList: [10, 25, 50, 100],	//可供选择的每页的行数(*)
	    queryParamsType: '', //默认值为 'limit' ,在默认情况下 传给服务端的参数为:offset,limit,sort // 设置为 '' 在这种情况下传给服务器的参数为:pageSize,pageNumber
	    queryParams:function(params){
			var temp = {     
		    	pageSize: params.pageSize,   //页面大小
		    	pageNumber: params.pageNumber,  //页码
		    	sortName: params.sortName,	//排序列
		    	sortOrder: params.sortOrder,	//排序方式
		    	queryJson: JSON.stringify(getQuetyData()),	//查询数据
			}
			return temp;
	    },
	    //search: true, 显示搜索框(客户端搜索)
	    sidePagination: "server", //服务端处理分页
	    //showToggle:true,                    //是否显示详细视图和列表视图的切换按钮
        //cardView: false,                    //是否显示详细视图
        detailView: false,                   //是否显示父子表
		columns: [{  
            //field: 'Number',//可不加  
            title: '序号',//标题  可不加  
            align : 'center',
            valign : 'middle',
            formatter: function (value, row, index) {  
                return index+1;  
            }  
        }, {
			title : '角色名称',
			field : 'role_name',
			align : 'center',
			valign : 'middle',
		},{
			title : '创建时间',
			field : 'create_time',
			align : 'center',
			valign : 'middle'
		},{
			title : '修改时间',
			field : 'modify_time',
			align : 'center',
			valign : 'middle'
		},{
			title : '操作',
			field : 'role_id',
			align : 'center',
			formatter : function(value,row,index){  
				var xgqx = '<a href="javascript:void()" οnclick="editModel(\''+ row.role_id + '\')">修改权限</a> ';
				var e = '<a href="javascript:void()" οnclick="editRole(\''+ row.role_id + '\')">编辑</a> ';  
				var d = '<a href="javascript:void()" οnclick="deleteRole(\''+ row.role_id +'\')">删除</a> '; 
				return xgqx+e+d;
			} 
		}],
		onLoadSuccess: function(){  //加载成功时执行  
			//alert("加载成功");  
		},  
		onLoadError: function(){  //加载失败时执行  
			alert("加载数据失败");  
		}  
	});
}

然后是查询时的调用:

/*查询*/
function search(){
	//解决表格查询时分页不初始化问题
	$table.bootstrapTable('destroy');	//销毁表格
	oTableInit();//重新加载表格
	//$table.bootstrapTable('refresh');	//刷新表格
}



  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值