最近在做项目的时候遇到这一个问题,找到这样的例子。
经过测试,上面这样的radio横向布局是可以做到的,关键是采用table的layout及radio行的isFormField设置为true,设置isFormField这点尤其重要,因为panel默认不是属于FormField的,因此即使设置了fieldLabel属性也不不会显示label。
生成此window的js如下:
- (new Ext.Window(...{
- id: 'hall_addPrjWindow',
- title: 'title',
- layout:'fit',
- width: 500,
- height: 300,
- buttonAlign: 'center',
- closeAction: 'hide',
- modal: true,
- items:[...{
- xtype: 'form',
- width: 400,
- frame.: true,
- defaultType: 'textfield',
- items:[...{
- id: 'prjNm',
- fieldLabel: '项目名称',
- name: 'prjNm',
- value: ''
- },...{
- xtype: 'panel',
- layout: 'table',
- fieldLabel: '项目权限',
- defaultType: 'radio',
- isFormField: true,
- items: [...{
- name: 'prjPermissionCode',
- boxLabel: '自由进入',
- value: ''
- },...{
- name: 'prjPermissionCode',
- boxLabel: '需要验证',
- value: ''
- }]
- },...{
- id: 'prjStartupDate',
- fieldLabel: '预计启动日期',
- name: 'prjStartupDate',
- value: ''
- }]
- }],
- buttons:[...{
- text: '建立新项目',
- handler: function()...{
- }
- }]
- })).show();