ExtJS column布局后labelField无法显示的有关问题
ExtJS column布局后labelField无法显示的问题
第一次用Extjs的column布局时遇见了很多问题,记录下来,供大家参考。column布局时常会碰见label不能显示或者控件显示错位等 问题,导致这些问题的常见原因如下:
1.formPanel上的控件显示不出来,控件的宽度太大,formpanel的宽度相对太小导致。
2. 为FormPanel设定了defaultType属性,没有为每个控件单独制定xtype属性。正确的做法是不设置defaultType。
3. 在每个column里再加上form layout,再在form里加textfield。
4.在新建TabPanel时,将其属性 layoutOnTabChange设置为true即可。(此方法不通用)
在Extjs开发的时候,如果想要并排的显示两个textField或者datefield,那肯定要用column样式的layout,但是当在其items中显示项目的时候,所有的fieldLabel都显示不出来,原因是,其column样式无法显示label,应该在中间层再嵌套一个layout:'form',然后要显示label的项作为此form层的子项即可
第一次用Extjs的column布局时遇见了很多问题,记录下来,供大家参考。column布局时常会碰见label不能显示或者控件显示错位等 问题,导致这些问题的常见原因如下:
1.formPanel上的控件显示不出来,控件的宽度太大,formpanel的宽度相对太小导致。
2. 为FormPanel设定了defaultType属性,没有为每个控件单独制定xtype属性。正确的做法是不设置defaultType。
3. 在每个column里再加上form layout,再在form里加textfield。
4.在新建TabPanel时,将其属性 layoutOnTabChange设置为true即可。(此方法不通用)
在Extjs开发的时候,如果想要并排的显示两个textField或者datefield,那肯定要用column样式的layout,但是当在其items中显示项目的时候,所有的fieldLabel都显示不出来,原因是,其column样式无法显示label,应该在中间层再嵌套一个layout:'form',然后要显示label的项作为此form层的子项即可
var pneast8 = new Ext.Panel({ region: 'center', // layout:'form', frame: true, bodyStyle: 'padding:5px 5px 0', items: [ { xtype: 'fieldset', height: 100, width: 500, layout: 'column', //解决横向并排的方法 items: [{ width:220, layout: 'form', labelWidth: 60, defaults: {width: 120}, items: [ { xtype: 'datefield', fieldLabel: '开始日期', name: 'startdt8', id: 'startdt8', endDateField: 'enddt8' // id of the end date field }] }, { width: 220, layout: 'form', labelWidth: 60, defaults: {width: 120}, items:[ { xtype: 'datefield', fieldLabel: '结束日期', name: 'enddt8', id: 'enddt8', startDateField: 'startdt8' // id of the start date field/ }] } ] }] })