浏览 2656 次
锁定老帖子 主题:请教:表单里的元素如何横着放
该帖已经被评为新手帖
|
|
---|---|
作者 | 正文 |
发表时间:2008-06-24
默认情况下各表单元素是竖着放着, 请问该如何设置才能把各元素横着放,就是放在一行 我试验了几种布局,也不好用,有的时候表单元素根本就看不到了; 另外下面那两个按钮也可以和这5个表单元素放在一行吗? //aaa字段 var customerTelField = new Ext.form.TextField({ fieldLabel:'aaa', name:'customerTel', allowBlank:false, length:15 }); //bbb字段 var serverTelField = new Ext.form.TextField({ fieldLabel:'bbb', name:'serverTel', allowBlank:false, length:15 }); //ccc字段 var centerField = new Ext.form.ComboBox({ fieldLabel:'ccc', name:'center', allowBlank:false, mode: 'local', readOnly:true, triggerAction:'all', length:5, store:new Ext.data.SimpleStore({ fields:['value','text'], data:[ ['all','全部'], ['gj','tom'], ['dt','jim], ['gs','luly], ['ct','lucy], ['ykt','lulu'] ] }), valueField: 'value', displayField: 'text' }); //开始日期字段 var startTimeField = new Ext.form.DateField({ fieldLabel:'开始时间', name:'startTime', format:'Y-m-d', readOnly:true, length:25 }); //结束日期字段 var endTimeField = new Ext.form.DateField({ fieldLabel:'结束时间', name:'endTime', format:'Y-m-d', readOnly:true, length:25 }); //表单对象 var queryForm = new Ext.FormPanel({ defaultType: 'textfield', labelAlign: 'right', region:'north', height:200, title: 'Query, autoWidth:true, url:'./RealTimeQueryServlet', items: [ customerTelField, serverTelField, centerField, startTimeField, endTimeField ], buttons:[{ text:'提交', handler:function(){ if(queryForm.getForm().isValid()) queryForm.getForm().submit({ waitMsg:'保存中,请稍后...', success:function(){ queryForm.getForm().reset(); store.reload(); } }); } },{ text:'取消', handler:function(){ queryForm.getForm().reset(); } }] }); 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2008-06-24
columnLayout,examples里有例子。
|
|
返回顶楼 | |
发表时间:2008-06-24
llm6101 写道 我的表单中有5个TextField元素,
默认情况下各表单元素是竖着放着, 请问该如何设置才能把各元素横着放,就是放在一行 我试验了几种布局,也不好用,有的时候表单元素根本就看不到了; 另外下面那两个按钮也可以和这5个表单元素放在一行吗? //aaa字段 var customerTelField = new Ext.form.TextField({ fieldLabel:'aaa', name:'customerTel', allowBlank:false, length:15 }); //bbb字段 var serverTelField = new Ext.form.TextField({ fieldLabel:'bbb', name:'serverTel', allowBlank:false, length:15 }); //ccc字段 var centerField = new Ext.form.ComboBox({ fieldLabel:'ccc', name:'center', allowBlank:false, mode: 'local', readOnly:true, triggerAction:'all', length:5, store:new Ext.data.SimpleStore({ fields:['value','text'], data:[ ['all','全部'], ['gj','tom'], ['dt','jim], ['gs','luly], ['ct','lucy], ['ykt','lulu'] ] }), valueField: 'value', displayField: 'text' }); //开始日期字段 var startTimeField = new Ext.form.DateField({ fieldLabel:'开始时间', name:'startTime', format:'Y-m-d', readOnly:true, length:25 }); //结束日期字段 var endTimeField = new Ext.form.DateField({ fieldLabel:'结束时间', name:'endTime', format:'Y-m-d', readOnly:true, length:25 }); //表单对象 var queryForm = new Ext.FormPanel({ defaultType: 'textfield', labelAlign: 'right', region:'north', height:200, title: 'Query, autoWidth:true, url:'./RealTimeQueryServlet', items: [ customerTelField, serverTelField, centerField, startTimeField, endTimeField ], buttons:[{ text:'提交', handler:function(){ if(queryForm.getForm().isValid()) queryForm.getForm().submit({ waitMsg:'保存中,请稍后...', success:function(){ queryForm.getForm().reset(); store.reload(); } }); } },{ text:'取消', handler:function(){ queryForm.getForm().reset(); } }] }); http://www.iteye.com/topic/203422?page=7 和你一样的问题 |
|
返回顶楼 | |
发表时间:2008-06-24
用Layout见帮助文档
|
|
返回顶楼 | |
发表时间:2008-06-24
EXT表单的布局有些不太灵活,比如横着放,虽然用ColumnLayout能够解决,但也着实麻烦。
另外一个问题也不太好处理,就是表单输入项的说明文字,除标签和输入框外如果要在右边加上附加的说明,目前EXT就无法很好解决。 |
|
返回顶楼 | |
发表时间:2008-06-24
tableLayout如何?
右边放一个Panel,里边用html写上你要的附加说明。 |
|
返回顶楼 | |