上篇《基於WebForm+EasyUI的業務管理系統造成之旅 -- 施工計劃查詢(Ⅷ)》,主要介紹經過報表工具數據鑽取,獲取施工計劃詳細信息。html
這篇咱們看看ParamQueryGrid【行合併】與【列合併】工具
以編號配置界面爲例,以下圖所示。post
設置表格列合併,代碼以下。url
1 /**設置表格列合併 2 colModel:列 3 ,startNumber:開始列 4 ,numberOfColumns:從開始列開始,合併列數量 5 ,titleText:合併列標題 6 **/ 7 function SetPqGridGroupHeaders(colModel, startNumber, numberOfColumns, titleText) { 8 var col = [], spanCols = []; 9 if (startNumber + numberOfColumns > colModel.length) { 10 return null; 11 } 12 for (var i = 0; i < colModel.length; i++) { 13 if (i == startNumber) { 14 var iCol = i; 15 var nclos = { dataIndx: iCol, title: titleText, width: 100, align: 'center' }; 16 var cVisibleColumns = 0; 17 for (var j = 0; j < numberOfColumns && (i + j < colModel.length); j++) { 18 if (!colModel[iCol + j].hidden) { 19 spanCols.push(colModel[iCol + j]); 20 cVisibleColumns++; 21 } 22 } 23 nclos.colModel = spanCols; 24 col.push(nclos); 25 if (cVisibleColumns > 0) { 26 i += cVisibleColumns; 27 } 28 } 29 if (i < colModel.length) { 30 col.push(colModel[i]); 31 } 32 } 33 return col; 34 }
SetPqGridGroupHeaders(colM, 1, 2, '基礎信息');spa
經過該方法,咱們能夠合併列序號從1開始,而且合併2列,列標題:'基礎信息'3d
以編號配置界面爲例,以下圖所示。code
設置表格行合併,代碼以下。orm
1 /**設置表格行合併 2 obj_ID: 表格ID 3 **/ 4 function Merge(obj_ID) { 5 if ($(obj_ID)) { 6 var data = $(obj_ID).pqGrid("option", "dataModel.data"); 7 var trs = $(obj_ID).find("tr.pq-grid-row"); 8 for (var i = data.length; i > 0; i--) { 9 for (var j = trs.length; j > 0; j--) { 10 var before = $(trs[j - 1]).find("td.pq-grid-cell:nth-child(" + i + ")"); 11 var end = $(trs[j]).find("td.pq-grid-cell:nth-child(" + i + ")"); 12 if (end.text() == before.text()) { 13 var rowSpan = (end.attr("rowspan") || 1); 14 before.attr("rowspan", parseInt(rowSpan) + 1); 15 end.remove(); 16 } 17 } 18 } 19 } 20 }
以編號配置界面爲例,以下圖所示。htm
經過NPOI導出Excel時,未能實現行、列合併Excel格式,有知道如何實現的小夥伴,留言告知一下,THX。blog