1、table表格合并
tables.dtGridColumns = [
{id: 'schoolName', title: '学校', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'eq',rowspan:'2'},
{id: 'originalNewMoney', title: '正价新签', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk', colspan:'4', coltitle:'净收入'},
{id: 'originalRenewalMoney', title: '正价续费', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'specialMoney', title: '特价', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'totalMoney', title: '总计', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'originalNewRegister', title: '正价新签', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk', colspan:'3', coltitle:'订单数'},
{id: 'originalRenewalRegister', title: '正价续费', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'specialRegister', title: '特价', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'studentCount', title: '在读人数', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'eq',rowspan:'2'},
{id: 'personTimeCount', title: '在读人次', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'eq',rowspan:'2'},
{id: 'originalCarryoverHour', title: '正价已结转', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk', colspan:'2', coltitle:'小时数'},
{id: 'specialCarryoverHour', title: '特价已结转', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'},
{id: 'confirmIncome', title: '确认金额', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk', colspan:'2', coltitle:'结转金额'},
{id: 'fcMoney', title: '实际结转', type: 'string', columnClass: 'text-center', fastQuery:true, fastQueryType:'lk'}
];效果
2、表格结尾增加合计（总计）行
//定义dtGridOption属性中加入totalCountColById
tables.dtGridOption = {
lang: 'zh-cn',
ajaxLoad: true,
check: false,
loadURL: ctx + '',
exportFileName: '在册人数以及库存课时统计',
columns: tables.dtGridColumns,
gridContainer: 'tb_main_body',
toolbarContainer: 'tb_main_tool',
tools: 'refresh|faseQuery|export[excel,pdf,]|print',
totalCountColById:['xx','xx'], // 总计id字段
pageSize: 10,
pageSizeLimit: [10, 20, 50, 100, 500]
};3、全部导出配置
①在初始化参数中配置
grid.diyparameters = { //参数
"exportOfQueryFlag" : "exportClassReadingRepay" // 值为后台给定值
};
②在search搜索方法中加入参数
search: function () {
grid.diyparameters = new Object();
grid.diyparameters.exportOfQueryFlag = "exportClassReadingRepay"; //导出全部hash 值
grid.refresh(true);
}
4、dtGrid跳转到指定页数
因为没找到有参数传递，然后看到js文件中写死的，所以做一点改变
找到jquery.dtGrid.js文件，在它的load方法中修改，记得给方法加上pageType参数
修改前：
dtGridReflectionObj.pager.nowPage = 1;
修改后：
dtGridReflectionObj.pager.nowPage = pageType ? pageType : 1;然后在调用load的时候传入参数就行，亲测有效。
5、dtGrid表格左侧固定
增加下列属性到dtGridOption中即可
tables.dtGridOption = {
lang:'zh-cn',
freezecol: 6,
freezerow:''
}6、动态表头与动态内容
有时表头与内容不是指定的，需要另外请求：
//初始化表格数据
initTable: function (datas, columns, tbbody, tbtool, type) { // datas表格数据，columns表头列，tbbody、tbtool表格容器
datas.exhibitDatas.forEach(function (v, i) {
var item = v.moneyMap;
for (var j in item) {
for (var k in item[j]) {
// console.log(item[j][k])
v[j+k] = item[j][k]; // 转换 将moneyMap中的数据放入到exhibitDatas中，适应dtGrid表格要求
}
}
});
console.log(datas)
var tables = {};
var that = this;
//定义表格列属性
tables.dtGridColumns = columns;
//定义表格
tables.dtGridOption = {
lang: 'zh-cn',
ajaxLoad: false, // 不使用ajaxLoad请求
exportFileName: '房租月摊销金额计算表',
datas: datas.exhibitDatas, // 当ajaxLoad为false时有效，表格内容数据
columns: tables.dtGridColumns, // 表头，json数组
gridContainer: tbbody,
toolbarContainer: tbtool,
tools: 'refresh|faseQuery|export[excel]|print',
pageSize: 10,
// totalCount: true,
// pageSizeLimit: [10, 20, 50],
onGridComplete: function () { // 表格加载完成后函数
}
};
prcGrid = $.fn.DtGrid.init(tables.dtGridOption);
prcGrid.diyparameters = { // 参数
"monthStamp": $("#beginMonth").val().replace(/-/g,''), // 年月
"queryContractType": "prc" // 标识
};
$("#" + tbbody).empty(); // 先清空内容
$("#" + tbtool).empty(); // 先清空内容
prcGrid.load();
}, requestFun: function (data, type) { // 处理数据且渲染表头方法
var that = this;
var arr = [{id: '', title: '教学区', type: 'string', columnClass: 'text-center', fastQuery: true, fastQueryType: 'eq', rowspan: '2'}]; // 存放渲染表格表头
var datas = []; // 存放对应字段名
data.forEach(function (v, i) {
if (v.typeCode) { // 如果不为空
var list = v.itemList;
if (list.length > 1) { // 需合并列大于1
list.forEach(function (val, index) {
if (index == 0) {
var obj = {id: val.itemCode, title: val.itemName, type: 'string',columnClass: 'text-center', fastQuery: true, fastQueryType: 'lk', colspan: list.length, coltitle: v.typeName};
} else {
var obj = {id: val.itemCode, title: val.itemName, type: 'string',columnClass: 'text-center', fastQuery: true, fastQueryType: 'lk'};
}
arr.push(obj);
datas.push(val.itemCode);
});
} else { //
var obj = {id: list[0].itemCode, title: list[0].itemName, type: 'string',columnClass: 'text-center', fastQuery: true, fastQueryType: 'eq', rowspan: '2'};
arr.push(obj);
datas.push(list[0].itemCode);
}
} else {
// return showAlertInfo("error","返回数据有问题，请稍候联系后台管理员！");
var list = v.itemList;
list.forEach(function (val, index) {
var obj = {id: val.itemCode, title: val.itemName, type: 'string',columnClass: 'text-center', fastQuery: true, fastQueryType: 'eq', rowspan: '2'};
arr.push(obj);
datas.push(val.itemCode);
})
}
})
// arr.push({id: '', title: '操作', type: 'string', columnClass: 'text-center', fastQuery: true, fastQueryType: 'eq', rowspan: '2'}); // 默认插入操作列
that.headerData = arr; // 存放处理后的表头数据
that.contentData = datas;
that.tableHeaderAddFun(datas); // 新增模块表头渲染方法，datas为新增模块内容
},
410
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
