1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | 1 // 记录被选行 Id 的数组 2 var selectedIds = new Array(); 3 // 控制全选框被点击行为 4 function globalSelection() { 5 var chks = document.getElementsByName(“gridId.subCheckBox”); 6 var topChk = dojo.byId(“gridId.checkBox”); 7 if (topChk.checked == true) { 8 for (var i = 0; i < chks.length; i++) { 9 // 当全选框被选中时,控制表身每行行首复选框行为,没有被选上的都被点击一次 10 if (chks.checked == false) { 11 chks.click(); 12 } 13 } 14 } else { 15// 当全选框选中状态消失时,清楚数组中所有记录,清除所有表身行首复选框被选中状态 16 selectedIds.splice(0, selectedIds.length); 17 for (var i = 0; i < chks.length; i++) { 18 chks.checked = false; 19 } 20 } 21 } 22 // 控制每行行首复选框被点击行为 23 function recordSelections(value, node) { 24 // 首先确定全选框是否该被选中,如果表身的所有行首复选框都被选中,则全选框被选中,否则全选框被 25 // 设置为非选中状态 26 var count1 = dojo.query('input:checked', 'formId').length; 27 if (dojo.byId("gridId.checkBox ").checked == true) { 28 count1 = count1 - 1; 29 } 30 var count2 = document.getElementsByName("gridId.subCheckBox").length; 31 var topChk = dojo.byId("gridId.checkBox"); 32 if (count1 == count2) { 33 topChk.checked = true; 34 } else { 35 topChk.checked = false; 36 } 37 // 维护全局数组,如果该复选框所在的行被选中,则记录该行 Id,否则从数组中清除 38 if (node.checked == true) { 39 selectedIds.push(value); 40 } else { 41 for (var i = 0; i < selectedIds.length; i++) { 42 if (selectedIds == value) { 43 selectedIds.splice(i, 1); 44 } 45 } 46 } 47 } 48 // 使 Enhanced Grid 首列为 checkBox 列的 formatter 49 function checkBoxFormatter(value) { 50 return "<div><input type='checkBox' name='gridId.subCheckBox ' 51 onclick=\"recordSelections(" + value + ", this)\"/></div>"; 52 } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | 1 <form id="formId" dojoType="dijit.form.Form"> 2 <table id="gridId" dojoType="dojox.grid.Enhanced Grid" autoHeight="true"> 3 <thead> 4 <tr> 5 <th width="10%" field="rowId" styles="text-align:center;" 6 formatter="checkBoxFormatter" sortable="false"> 7 <div> 8 <input type="checkBox" id="gridId.checkBox" name="gridId.checkBox" 9 onclick="globalSelection();"/> 10 </div> 11 </th> 12 <th width="45%" field="field1" styles="text-align:left;"> 13 <div>fieldName1</div> 14 </th> 15 <th width="45%" field="field2" styles="text-align:left;"> 16 <div>fieldName2</div> 17 </th> 18 </tr> 19 </thead> 20 </table> 21 </form> |
欢迎光临 电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/) | Powered by Discuz! 7.0.0 |