bootstrap-table 设置列宽无效
//bootstrap-table
$(function () {
//1.初始化Table
var oTable = new TableInit();
oTable.Init();
//2.初始化Button的点击事件
var oButtonInit = new ButtonInit();
oButtonInit.Init();
});
var TableInit = function () {
var oTableInit = new Object();
//初始化Table
oTableInit.Init = function () {
$('#table').bootstrapTable({
url: '${pageContext.request.contextPath}/supplier/find', //请求后台的URL(*)
method: 'get', //请求方式(*)
toolbar: '#toolbar', //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
pagination: true, //是否显示分页(*)
sortable: false, //是否启用排序
sortOrder: "asc", //排序方式
queryParams: oTableInit.queryParams,//传递参数(*)
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: 10, //每页的记录行数(*)
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端
showColumns: true, //是否显示所有的列按钮
showRefresh: true, //是否显示刷新按钮
minimumCountColumns: 2, //最少允许的列数
clickToSelect: true, //是否启用点击选中行
height: 550, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度
uniqueId: "supplier_id", //每一行的唯一标识,一般为主键列
showToggle:true, //是否显示详细视图和列表视图的切换按钮
cardView: false, //是否显示详细视图
detailView: true, //是否显示父子表
showPaginationSwitch:false,//是否显示隐藏分页按钮
mobileResponsive:true,
columns: [{
checkbox: true
}, {
field: 'supplier_name',
title: '供应商名称',
width: '100px'
}, {
field: 'mobilephone',
title: '手机',
width: '100px'
}, {
field: 'fixedlinetelephone',
title: '电话'
}, {
field: 'address.address',
title: '地址',
width: 250
} ,{
field: 'addressZone',
title: '所在地区',
width: '200px'
} ,{
field: 'supplierItemsType',
title: '供应类型',
width: '200px'
} ,{
field: 'evaluate',
title: '好评度',
width: '50'
}, {
field: 'email',
title: '邮箱',
visible:false,
width: '80px'
}, {
field: 'qq',
title: 'QQ号',
visible:false,
width: '100px'
}, {
field: 'weChat',
title: '微信号',
visible:false,
width: '100px'
}, {
field: 'contactPersonList',
title: '联系人',
width: '350px',
formatter:function(value,row,index){
var contactPerson = "";
$.each(value,function(index){
contactPerson += value[index].name + " ";
contactPerson += "类型:" + value[index].identityType.typeName + " ";
contactPerson += "手机:" + value[index].mobilephone + " ";
//alert( value[index].identityType.typeName);
});
return contactPerson;
},
},{
field:'supplier_id',
title:'操作',
width: '200px',
formatter:function(value,row,index){
var e = '<a href="#" mce_href="#" class="btn btn-info btn-xs" onclick="edit(\''+ row.supplier_id + '\')"><i class="fa fa-edit"></i>编辑</a> ';
var d = '<a href="#" mce_href="#" class="btn btn-danger btn-xs" onclick="del(\''+ row.supplier_id +'\')"><i class="fa fa-trash"></i> 删除</a> ';
var s = '<a href="#" mce_href="#" class="btn btn-primary btn-xs" onclick="supplier(\''+ row.supplier_id +'\')"><i class="fa fa-trash"></i> 联系人</a> ';
return e+d+s;
}
} ]
});
};
//得到查询的参数
oTableInit.queryParams = function (params) {
var temp = { //这里的键的名字和控制器的变量名必须一直,这边改动,控制器也需要改成一样的
limit: params.limit, //页面大小
offset: params.offset, //页码
supplier_name:$("#supplier_name").val(),
mobilephone:$("#mobilephone").val(),
fixedlinetelephone:$("#fixedlinetelephone").val(),
add:$("#address").val()
};
return temp;
};
return oTableInit;
};
var ButtonInit = function () {
var oInit = new Object();
var postdata = {};
oInit.Init = function () {
//初始化页面上面的按钮事件
};
return oInit;
};
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
width: 100
文档:http://bootstrap-table.wenzhi...