本文主要是介绍【Bootstrap Table】表格列合并 设置表格内容为勾选框,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
效果:1.列合并:
1.1写在$('#bootstrap-table').bootstrapTable中
onLoadSuccess: function () {//当所有数据被加载时触发处理函数var data = $('#bootstrap-table').bootstrapTable('getData', true);//获取当前页数据mergeCells(data,'number',1,$('#bootstrap-table')); //列名mergeCells(data,'item',1,$('#bootstrap-table'));mergeCells(data,'severity',1,$('#bootstrap-table'));},onPageChange: function (){//当页面更改页码或页面大小时触发var data = $('#bootstrap-table').bootstrapTable('getData', true);mergeCells(data,'number',1,$('#bootstrap-table'));mergeCells(data,'item',1,$('#bootstrap-table'));mergeCells(data,'severity',1,$('#bootstrap-table'));},
1.2写在$('#bootstrap-table').bootstrapTable外面
function mergeCells(data,fieldName,colspan,target){//声明一个map计算相同属性值在data对象出现的次数和var sortMap = {};for(var i = 0 ; i < data.length ; i++){for(var prop in data[i]){if(prop == fieldName){var key = data[i][prop] //fieldName的valueif(sortMap.hasOwnProperty(key)){sortMap[key] = sortMap[key] * 1 + 1;} else {sortMap[key] = 1;}break;}}}//合并单元格var index = 0;for(var prop in sortMap){var count = sortMap[prop] * 1;$(target).bootstrapTable('mergeCells',{index:index, field:fieldName, colspan: colspan, rowspan: count});index += count;}}
2.设置勾选框(在columns中)
{field: 'problem',title: '检查问题',width: '50px',formatter: function (value, row , index) {return '<input type="checkbox"/> ';}},
这篇关于【Bootstrap Table】表格列合并 设置表格内容为勾选框的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!