首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

ExtJS column布局后labelField无法显示的有关问题

2012-06-26 
ExtJS column布局后labelField无法显示的问题第一次用Extjs的column布局时遇见了很多问题,记录下来,供大家

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层的子项即可

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/        }]        }        ]    }]})

热点排行