1 /*
2 * *合并单元格的函数，合并表格内所有连续的具有相同值的单元格。调用方法示例：
3 * *store.on("load",function(){gridSpan(grid,"row","[FbillNumber],[FbillDate],[FAudit],[FAuditDate],[FSure],[FSureDate]","FbillNumber");});
4 * *参数：grid-需要合并的表格,rowOrCol-合并行还是列,cols-需要合并的列（行合并的时候有效）,sepCols以哪个列为分割(即此字段不合并的2行，其他字段也不许合并)，默认为空
5 */
6 function gridSpan(grid, rowOrCol, cols, sepCol){
7 // alert(‘grid====‘+grid+‘;rowOrCol=‘+rowOrCol+‘;cols=‘+cols);
8 var array1 = new Array();
9 var arraySep = new Array();
10 var count1 = 0;
11 var count2 = 0;
12 var index1 = 0;
13 var index2 = 0;
14 var aRow = undefined;
15 var preValue = undefined;
16 var firstSameCell = 0;
17 var allRecs = grid.getStore().getRange();
18 if(rowOrCol == "row"){
19 count1 = grid.getColumnModel().getColumnCount(); //列数
20 count2 = grid.getStore().getCount(); //行数(纪录数)
21 } else {
22 count1 = grid.getStore().getCount();
23 count2 = grid.getColumnModel().getColumnCount();
24 }
25 for(i = 0; i < count1; i++){
26 if(rowOrCol == "row"){
27 var curColName = grid.getColumnModel().getDataIndex(i); //列名
28 var curCol = "[" + curColName + "]";
29 if(cols.indexOf(curCol) < 0)
30 continue;
31 }
32
33
34 preValue = undefined;
35 firstSameCell = 0;
36 array1[i] = new Array();
37 for(j = 0; j < count2; j++){
38
39 if(rowOrCol == "row"){
40 index1 = j;
41 index2 = i;
42 } else {
43 index1 = i;
44 index2 = j;
45 }
46 var colName = grid.getColumnModel().getDataIndex(index2);
47 if(sepCol && colName == sepCol)
48 arraySep[index1] = allRecs[index1].get(sepCol);
49 var seqOldValue = seqCurValue = "1";
50 if(sepCol && index1 > 0){
51 seqOldValue = arraySep[index1 - 1];
52 seqCurValue = arraySep[index1];
53 }
54
55 if(allRecs[index1].get(colName) == preValue && (colName == sepCol || seqOldValue == seqCurValue)){
56 //alert(colName + "======" + seqOldValue + "======" + seqCurValue);
57 allRecs[index1].set(colName, "");
58 array1[i].push(j);
59 if(j == count2 - 1){
60 var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
61 if(rowOrCol == "row"){
62 allRecs[index].set(colName, preValue);
63 } else {
64 allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
65 }
66 }
67 } else {
68 if(j != 0){
69 var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
70 if(rowOrCol == "row"){
71 allRecs[index].set(colName, preValue);
72 } else {
73 allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
74 }
75 }
76 firstSameCell = j;
77 preValue = allRecs[index1].get(colName);
78 allRecs[index1].set(colName, "");
79 if(j == count2 - 1){
80 allRecs[index1].set(colName, preValue);
81 }
82 }
83
84 }
85 }
86 grid.getStore().commitChanges();
87
88 // 添加所有分隔线
89 var rCount = grid.getStore().getCount();
90 for(i = 0; i < rCount; i ++){
91 hRow = grid.getView().getRows()[i];
92 hRow.style.border = "none";
93 //hRow.style.borderBottom= "none";
94 for(j = 0; j < grid.getColumnModel().getColumnCount(); j ++){
95 aRow = grid.getView().getCell(i,j);
96 aRow.style.margin="0";
97 aRow.style.padding="0";
98
99 if(i == 0){
100 aRow.style.borderTop = "none";
101 aRow.style.borderLeft = "1px solid #8db2e3";
102
103 }else if(i == rCount - 1){
104 aRow.style.borderTop = "1px solid #8db2e3";
105 aRow.style.borderLeft = "1px solid #8db2e3";
106 aRow.style.borderBottom = "1px solid #8db2e3";
107 }else{
108 aRow.style.borderTop = "1px solid #8db2e3";
109 aRow.style.borderLeft = "1px solid #8db2e3";
110 }
111 if(j == grid.getColumnModel().getColumnCount()-1)
112 aRow.style.borderRight = "1px solid #8db2e3";
113 if(i == rCount-1)
114 aRow.style.borderBottom = "1px solid #8db2e3";
115 }
116 }
117 // 去除合并的单元格的分隔线
118 for(i = 0; i < array1.length; i++){
119 if(!Ext.isEmpty(array1[i])){
120 for(j = 0; j < array1[i].length; j++){
121 if(rowOrCol == "row"){
122 aRow = grid.getView().getCell(array1[i][j],i);
123 aRow.style.borderTop = "none";
124
125 } else {
126 aRow = grid.getView().getCell(i, array1[i][j]);
127 aRow.style.borderLeft = "none";
128 }
129 }
130 }
131 }
132
133 for(i = 0; i < count1; i++){
134 if(rowOrCol == "row"){
135 var curColName = grid.getColumnModel().getDataIndex(i); //列名
136 var curCol = "[" + curColName + "]";
137 if(cols.indexOf(curCol) < 0)
138 continue;
139 }
140
141 for(j = 0; j < count2; j++){
142 var hbcell = grid.getView().getCell(j,i);
143 hbcell.style.background="#FFF"; //改变合并列所有单元格背景为白色
144 }
145 }
146
147 };
使用方法示例:
1 this.gridPanel = new HT.GridPanel({
2 region : ‘center‘,
3 tbar : this.topbar,
4 border:true,
5 // hideBorders:true,
6 columnLines:false,
7 // bodyBorder :false,
8 // 使用RowActions
9 rowActions : true,
10 id : ‘PageGrid‘,
11 url : __ctxPath + "/qywz/listPage.do",
12 fields : [ {
13 name : ‘id‘,
14 type : ‘int‘
15 }, ‘name‘, ‘contant‘, ‘edituserid‘, ‘editdate‘, ‘createdate‘,
16 ‘isenabled‘, ‘navigationMenuId‘ ],
17 columns : [ {
18 header : ‘id‘,
19 dataIndex : ‘id‘,
20 hidden : true
21 }, {
22 header : ‘页面名称‘,
23 dataIndex : ‘name‘
24 }, {
25 header : ‘内容‘,
26 dataIndex : ‘contant‘
27 }, {
28 header : ‘编辑人‘,
29 dataIndex : ‘edituserid‘
30 }, {
31 header : ‘编辑日期‘,
32 dataIndex : ‘editdate‘
33 }, {
34 header : ‘生成日期‘,
35 dataIndex : ‘createdate‘
36 }, {
37 header : ‘有效标志‘,
38 dataIndex : ‘isenabled‘
39 }, {
40 header : ‘对应导航菜单表ID‘,
41 dataIndex : ‘navigationMenuId‘
42 }, new Ext.ux.grid.RowActions({
43 header : ‘管理‘,
44 width : 100,
45 actions : [ {
46 iconCls : ‘btn-del‘,
47 qtip : ‘删除‘,
48 style : ‘margin:0 3px 0 3px‘
49 }, {
50 iconCls : ‘btn-edit‘,
51 qtip : ‘编辑‘,
52 style : ‘margin:0 3px 0 3px‘
53 } ],
54 listeners : {
55 scope : this,
56 ‘action‘ : this.onRowAction
57 }
58 }) ]
59 // end of columns
60 });
61 var gridp = this.gridPanel;
62
63 this.gridPanel.addListener(‘rowdblclick‘, this.rowClick);
64
65 // ==>监听load , 执行合并单元格
66 this.gridPanel.getStore().on(‘load‘, function () {
67 gridSpan(gridp,"row","[name],[contant]");
68
69 });
时间： 2024-10-08 19:34:55