Ext 动态生成checkbox及清除的解决方法

Ext 动态生成checkbox及清除的解决方法

EXT

1. 在formpanel中定义有一个panel： 
{ 
  xtype : 'panel', 
  title : '请选择用户所查看的报表', 
  id : 'reportRoleFieldset', 
  autoHeight : true, 
  border : false 
} 
2. 向后台查询数据的方法(在4中被调用)： 
function getStoreByRole(roleId){ 
  var storeByRoleId = new Ext.data.JsonStore({ 
  autoLoad : true, 
  url : "systemset.do?method=listReportsByRoleId&roleId=" + roleId, 
  fields : ['reportId', 'reportName', 'reportGroupId']}); 
  storeByRoleId; 
} 
3. 动态加载checkb： 
// 动态在 fieldset 中添加 checkbox 
function addReportModule(store) { 
var size = store.getTotalCount(); 
// 获得 fieldset 
var fieldset = Ext.getCmp("reportRoleFieldset"); 
//在加载新的数据之前把之前的checkbox清除 
for (var i = 0; i < storeReportRole.getTotalCount(); i++) { 
var tmpa = Ext.getCmp("reportId" + i); 
if (tmpa) { 
                      tmpa.destroy(); 
} 
} 
var itemsCH = document.getElementsByName("reportIDs"); 
for (var i = 0; i < size; i++) { 
var reportId = store.getAt(i).data.reportId; 
var reportName = store.getAt(i).data.reportName; 
var checkboxModule = new Ext.form.Checkbox({ 
id : "reportId" + i, 
name : "reportIDs", 
autoScroll : false, 
width : 90, 
boxLabel : reportName, 
inputValue : reportId, 
anchor : "90%", 
hideLabel : true 
}); 
fieldset.ownerCt.add(checkboxModule); 
fieldset.ownerCt.doLayout(true); 
} 
} 
4. 动态改变checkbox值： 
...formpanel中一个下拉框... 
略... 
listeners : { 
select : function() { 
   var roleId = Ext.getCmp("roleIdCombo").getValue(); 
   var storeList = getStoreByRole(roleId); 
   setTimeout(function() {        addReportModule(storeList); 
   }, 1500); 
         } 
} 
}