extjs3.x 动态生成复选框

1 直接看代码(摘要)

{
		.....
		id:ex_itemgroup_type11 ,//记住这个Id
		item:[
			{
				fieldLabel : 'xx',
				name : 'xxxx',
				width : 350,
				xtype:'datefield',
				format:'Y-m-d'
			},
			....
			{   fieldLabel : 'xx2',
				name : 'xxxx2',
				width : 350,
				xtype:'datefield',
				format:'Y-m-d'
			}
		]
			
},
.....省略...

下面代码将在xx2 后面添加复选框
url请求的数据库将查处以下数据
zdId    zdString     zdType
1          one          5
2          two          5
//动态添加复选框
	 Ext.Ajax.request({
	 	url : __ctxPath+'/contract/listGroupZDBox.do?zdType=5',
	 	
		method : 'post',
		success : function(response) {
			var result = Ext.util.JSON.decode(response.responseText);
			
			  var unitColumns=[];
			  for(var i = 0;i < result.length;i++){
						unitColumns.push({
							boxLabel: result.result[i].zdString, 
							name: result.result[i].zdId, 
							checked: false
						});
				}
				
				var itemsGroup = new Ext.form.CheckboxGroup({
					id:'ex_opItems_type11',
					bodyStyle:'background-color: transparent;margin-top:10px;',
					fieldLabel: '动态生成的复选框',
					columns: 2,
					items: unitColumns
				});		
            
			Ext.getCmp('ex_itemgroup_type11').add(itemsGroup);
			Ext.getCmp('ex_itemgroup_type11').doLayout();
		}
	 });//ajax -end/*/

2 复选框值处理

        text : '保存',
		iconCls : 'btn-ok',
		handler : function() {
			var ids = "";  
			
			var cusTypeCheckboxGroup = Ext.getCmp('ex_opItems_type11');
			
			var items = cusTypeCheckboxGroup.items;    
			for (var i = 0; i < items.length; i++) {    
			    if (items.itemAt(i).checked) {    
			        ids=ids+items.itemAt(i).name+",";    
			    }    
			}
        }

猜你喜欢

转载自blog.csdn.net/wyAdfAo/article/details/81745361
今日推荐