转:Extjs2.0之横向Radio经典布局

我想大家最需要的就是这样的布局

 

但是找遍google,要么是太复杂在render里添加后续radio,要么是采用FieldSet方式额外加了一大框。但是我想像中需要的却是上面这种方式。

经过测试,上面这样的radio横向布局是可以做到的,关键是采用table的layout及radio行的isFormField设置为true,设置isFormField这点尤其重要,因为panel默认不是属于FormField的,因此即使设置了fieldLabel属性也不不会显示label。

生成此window的js如下:

 

 1 (new Ext.Window({
 2     id: 'hall_addPrjWindow',
 3     title: 'title',
 4     layout:'fit',
 5     width: 500,
 6     height: 300,
 7     buttonAlign: 'center',
 8     closeAction: 'hide',
 9     modal: true,
10     items:[{
11         xtype: 'form',
12         width: 400,
13         frame: true,
14         defaultType: 'textfield',
15         items:[{
16             id: 'prjNm',
17             fieldLabel: '项目名称',
18             name: 'prjNm',
19             value: ''
20         },{
21             xtype: 'panel',
22             layout: 'table',
23             fieldLabel: '项目权限',
24             defaultType: 'radio',
25             isFormField: true,
26             items: [{
27                 name: 'prjPermissionCode',
28                 boxLabel: '自由进入',
29                 value: ''
30             },{
31                 name: 'prjPermissionCode',
32                 boxLabel: '需要验证',
33                 value: ''
34             }]
35         },{
36             id: 'prjStartupDate',
37             fieldLabel: '预计启动日期',
38             name: 'prjStartupDate',
39             value: ''
40         }]
41     }],
42     buttons:[{
43         text: '建立新项目',
44         handler: function(){
45             
46         }
47     }]
48 })).show();

 

转自:http://blog.csdn.net/applebomb/article/details/2138802

posted @ 2012-11-11 19:10  我思故我在...  阅读(257)  评论(0编辑  收藏  举报