FieldSet的使用--在数据周围绘制一个带标题的框

今天有个任务,如图,了解到一个新的组件FieldSet

API给出的解释是--针对某一组字段的标准容器。

简单代码:

 new Ext.form.FieldSet({
			    title:'条件细别',
	                     border:true, 
	                     anchor :'99%',
	                     autoHeight:true,
	                     items:[{
	                    	 xtype:'checkbox',
	                    	 boxLabel: '全部',	          
	                     },{
	                    	 columns:6,
	                    	 xtype:'checkboxgroup',              	
	                    	 items:[{ boxLabel: '姓名'},{boxLabel: '性别'},{boxLabel: '民族'},{boxLabel: '出生日期'},{boxLabel: '户籍地'},{boxLabel: '是否登记户口'}]
	                     },{
	                    	 xtype:'checkboxgroup',    
	                    	 columns:6,
	                    	 items:[{ boxLabel: '就学情况'},{boxLabel: '寄宿情况'},{boxLabel: '健康状况'},{boxLabel: '实际监护情况'},{hidden:true,labelSeparator:''},{boxLabel: '备注'}]
	                     },{
	                    	 columns:3,
	                    	 xtype:'checkboxgroup',              	
	                    	 items:[{ boxLabel: '村(居)委会联系人'},{boxLabel: '父亲务工地点'},{boxLabel: '母亲务工地点'}]
	                     }]
			         }) ,
Ext原始的样式是:.x-fieldset{border:1px solid #B5B8C8;padding:10px;margin-bottom:10px;display:block;}

fieldset:对表单进行分组,一个表单可以有多个fieldset 

legend:说明每组的内容描述

fieldset默认是带边框的,而legend默认一般显示在左上角。

用法:点击打开链接


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值