Extjs dynamically modifies the gridPanel column header information and store data. extjsgridpanel

Extjs dynamically modifies the gridPanel column header information and store data. extjsgridpanel

1/********************************* checkbox button historical alarm information ** * *********************************/2 var checkboxHistoryModule = new Ext. form. checkbox ({3 id: "alarmHistoryInfoCheck", 4 name: "alarmHistoryInfoCheck", 5 // width: 70, 6 boxLabel: "historical alarm information", 7 // checked: true, 8 handler: function () {9 // when the historical information is selected or canceled, the grid column header and data information are dynamically loaded. When the historical information is selected, load columns with more processing persons and processing time. Column 10 if (this. checked = true) {11 var queryAlarmInfoHis_store = Ext. create ('ext. data. store', {12 autoLoad: true, 13 pageSize: 50, 14 model: 'queryalarminfohistorydata', 15 proxy: {16 type: 'ajax ', 17 url: 'queryalarminfo. do ', 18 extraParams: {19 isShowHistory: "true" 20}, 21 reader: {22 type: 'json', 23 root: 'datalist', 24 totalProperty: 'Total' 25} 26} 27}); 28 29 var queryAlarmInfoHis_columns = 30 [{text: 'sequence number ', xtype: 'rownumberer', width: 40}, 31 {text: 'topology', dataIndex: 'link', flex: 1}, 32 {33 text: 'workflow id', 34 dataIndex: 'iflowid', 35 flex: 1, 36 // hover reminder 37 renderer: function (value, metaData, record, colIndex, store, view) 38 {39 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 40 return value; 41 }}, 42 {43 text: 'Project name', 44 dataIndex: 'prjname', 45 flex: 1, 46 // mouse suspension reminder 47 renderer: function (value, metaData, record, colIndex, store, view) 48 {49 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 50 return value; 51 }}, 52 {53 text: 'workflow name', 54 dataIndex: 'flowname', 55 flex: 1, 56 // hover reminder 57 renderer: function (value, metaData, record, colIndex, store, view) 58 {59 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 60 return value; 61 }}, 62 {63 text: 'activity name', 64 dataIndex: 'actname', 65 flex: 1, 66 // hover reminder 67 renderer: function (value, metaData, record, colIndex, store, view) 68 {69 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 70 return value; 71 }}, 72 {73 text: 'alert type', 74 dataIndex: 'type', 75 width: 80, 76 // hover the mouse to remind 77 renderer: function (value, metaData, record, colIndex, store, view) 78 {79 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 80 return value; 81 }}, 82 {83 text: 'alert description', 84 dataIndex: 'warede', 85 flex: 1, 86 // hover the mouse to remind 87 renderer: function (value, metaData, record, colIndex, store, view) 88 {89 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 90 return value; 91 }}, 92 {93 text: 'alert time', 94 dataIndex: 'warntime', 95 width: 80, 96 // hover the mouse to remind 97 renderer: function (value, metaData, record, colIndex, store, view) 98 {99 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 100 return value; 101} 102}, 103 {text: 'processing description', dataIndex: 'delde ', width: 80}, 104 {105 text: 'handler ', 106 dataIndex: 'deluser', 107 width: 80,108 // hover alarm 109 renderer: function (value, metaData, record, colIndex, store, view) 110 {111 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 112 return value; 113} 114}, 115 {116 text: 'processing time', 117 dataIndex: 'deltime', 118 width: 80,119 // hover alarm 120 renderer: function (value, metaData, record, colIndex, store, view) 121 {122 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 123 return value; 124} 125} 126]; 127 128 // Method for reloading gridpanel column information 129 queryAlarmInfo_grid.reconfigure (queryAlarmInfoHis_store, queryAlarmInfoHis_columns); 130 131} else {132 var queryAlarmInfoNotHis_store = Ext. create ('ext. data. store', {133 autoLoad: true, 134 pageSize: 50,135 model: 'queryarminfodata', 136 proxy: {137 type: 'ajax ', 138 url: 'queryalarminfo. do ', 139 extraParams: {140 isShowHistory: "false" 141}, 142 reader: {143 type: 'json', 144 root: 'datalist', 145 totalProperty: 'Total' 146} 147} 148}); 149 150 var queryAlarmInfoNotHis_columns = 151 [{text: 'sequence number ', xtype: 'rownumberer', width: 40}, 152 {text: 'topology', dataIndex: 'link', flex: 1}, 153 {154 text: 'workflow id', 155 dataIndex: 'iflowid', 156 flex: 1,157 // hover alarm 158 renderer: function (value, metaData, record, colIndex, store, view) 159 {160 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 161 return value; 162 }}, 163 {164 text: 'Project name', 165 dataIndex: 'prjname', 166 flex: 1,167 // hover alarm 168 renderer: function (value, metaData, record, colIndex, store, view) 169 {170 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 171 return value; 172 }}, 173 {174 text: 'workflow name', 175 dataIndex: 'flowname', 176 flex: 1,177 // hover alarm 178 renderer: function (value, metaData, record, colIndex, store, view) 179 {180 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 181 return value; 182 }}, 183 {184 text: 'activity name', 185 dataIndex: 'actname', 186 flex: 1,187 // hover alarm 188 renderer: function (value, metaData, record, colIndex, store, view) 189 {190 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 191 return value; 192 }}, 193 {194 text: 'alert type', 195 dataIndex: 'type', 196 width: 80,197 // hover alarm 198 renderer: function (value, metaData, record, colIndex, store, view) 199 {200 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 201 return value; 202 }}, 203 {204 text: 'alert description', 205 dataIndex: 'warede', 206 flex: 1,207 // hover alarm 208 renderer: function (value, metaData, record, colIndex, store, view) 209 {210 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 211 return value; 212 }}, 213 {214 text: 'alert time', 215 dataIndex: 'waretime', 216 width: 80,217 // hover alarm 218 renderer: function (value, metaData, record, colIndex, store, view) 219 {220 metaData. tdAttr = 'data-qtip = "'+ value +'" '; 221 return value; 222 }}, 223 {text: 'processing description', dataIndex: 'delde ', width: 80} 224]; 225 226 queryAlarmInfo_grid.reconfigure (queryAlarmInfoNotHis_store, queryAlarmInfoNotHis_columns); 227 228} 229 });

The above code snippet is a method for dynamically changing the gridpanel column header and displaying information as needed. I personally summarize it. If you reprint it, please indicate the source. Thank you.