bootstrapTable格式、传参、搜索

bootstrapTable格式

//bootstrapTable数据表格回显
function doQuery(){
	var curPage = 1 ;
	var pageSize = 10 ;
	
		$('#tbl_faultcase').bootstrapTable({
		url : '${ctx}/qcmtt/ajax/getdivfaultdiag2',
		method: 'POST',                      //请求方式(*)
		contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
		striped: true,                      //是否显示行间隔色
		cache: false,                       //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
		pagination: true,                   //是否显示分页(*)
		sortable: false,                     //是否启用排序
		sortOrder: "asc",                   //排序方式
		sidePagination: "server",           //分页方式:client客户端分页,server服务端分页(*)
		search: false,                       //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
		strictSearch: false,
		pageSize : pageSize,
		showHeader : true,
		showColumns: false,                  //是否显示所有的列
		showRefresh: false,                  //是否显示刷新按钮
		minimumCountColumns: 2,             //最少允许的列数
		clickToSelect: true,                //是否启用点击选中行
		detailView: false, 
		pageList:[10],
		onPageChange:function(number,size){ 
			curPage = number; //第几页
			pageSize = size; // 每页显示条数
		}, 
		queryParams: getParams,//携带参数
		columns : [
					{
						title : '故障编号',
						field : 'faultCode',
						sortable : true,
						align : 'center'
					},
					{
						title : '故障类型',
						field : 'faultType',
						sortable : true,
						align : 'center'
					},
					{
						title : '故障名称',
						field : 'faultName',
						align : 'center'
					},
					{
						title : '故障机器',
						field : 'unitName',
						sortable : true,
						align : 'center'
					},
					{
						title : '故障程度',
						field : 'faultDegree',
						sortable : true,
						align : 'center',
						formatter : function(value, row, index) {
							if (row['faultDegree'] == 'heavy') {
								return '严重';
							}
							if (row['faultDegree'] == 'normal') {
								return '一般';
							}
							if (row['faultDegree'] == 'light') {
								return '轻微';
							}
						}
					},
					{
						title : '发生地点',
						field : 'happenPlace',
						align : 'center'
					},
					{
						title : '发生时机',
						field : 'happenOccasion',
						align : 'center'
					},
					{
						title : '操作',
						field : 'id',
						align : 'center',
						formatter : function(value, row, index) {
							var html = "";
							html += '删除';
							html += '   ';
							html += '修改';
							return html;
						}
					}, 
				]
			   
	});
		
	function getParams(params){
		var temp = {
			faultName : $('#faultNameSearch').val(),//搜索条件
			curPage:(params.offset/params.limit) + 1 , 
			pageSize:pageSize,
		}
		return temp;
	}
	
} 




//搜索也是刷新
function doSearch(){
	$('#tbl_faultcase').bootstrapTable('refresh');
}


 
  • 实现思路:获取查询块中所有的对象,动态存放在查询返回的参数中 
    需要注意: 
    当查询没有值的之后,不能放入到查询参数中,否则会把数据当做空来查询,从而导致无法查询到数据
function queryParams(params) {
    var param = {};
    $('#query-form').find('[name]').each(function () {
        var value = $(this).val();
        if (value != '') {
            param[$(this).attr('name')] = value;
        }
    });

    param['pageSize'] = params.limit;   //页面大小
    param['pageNumber'] = params.offset;   //页码

    return param;
}

function customSearch(text) {
    $table.bootstrapTable('refresh');//刷新Table,Bootstrap Table 会自动执行重新查询
}
  • 重置函数的实现 
    实现思路:循环获取query-form的控件,并把其值置空
function resetSearch() {
    $('#query-form').find('[name]').each(function () {
        $(this).val('');
    });
}

你可能感兴趣的:(bootstrapTable格式、传参、搜索)