如图所示 例如银行承兑汇票有效期 或者 银行承兑汇票注销日期 这两个文本框前的name ,由于字数过多,给流出的长度无法满足,应该改哪个属性才合适。
columnWidth这个属性不行 它主要是改后面的文本框长度的    var loanCompactForm = Ext.create('Ext.form.Panel', {
        buttonAlign: 'center',
        id: 'form_loanCompact',
        layout: "form",
        bodyStyle: {
            padding: '10px'
        },
        frame: false,
        border: 0,
        defaults: {
            labelWidth:120
        },
        items: [
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_1]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_2]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_3]
                    }
                ]
            },
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_4]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_5]
                    } ,
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_6]
                    }
                ]
            },
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_7]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_8]
                    } ,
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_9]
                    }
                ]
            },
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_10]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_11]
                    } ,
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_12]
                    }
                ]
            },
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_13]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_14]
                    } ,
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_15]
                    }
                ]
            },
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_16]
                    },
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_17]
                    } ,
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_18]
                    }
                ]
            } ,
            {
                layout: 'column',
                items: [
                    {   layout: 'form',
                        columnWidth: .3,
                        items: [form_19]
                    }
                ]
            }        ],
        buttons: [form_query_reset,
            {
                text: '提交',
                formBind: true,
                disabled: true,
                iconCls: 'icon_submit',
                listeners: {
                    "click": function () {
                        // userStore.loadPage(1);
                    }
                }
            }
        ]
    });
Ext JS表单布局

解决方案 »

  1.   

    修改labelWidth这个属性的值就可以了
      

  2.   

    anchor : '100%',改下这个属性。
      

  3.   

    你使用了form的布局方式,为form中每个控件用百分比指定了宽度,e.g:columnWidth:.3[表示占30%] 那你设定的那个默认宽度【labelWidth:120】就没有用了,你找到你要修改的那个form控件,然后把columnWidth的值改一下应该就可以了
      

  4.   

    我也尝试过修改columnWidth的值 但是改变的只是后面文本框的长度, 对于前面name的长度根本起不到作用的啊 
    如图
      

  5.   

    你代码中的form_1,form_2等对象的内容是什么啊,里面应该设定了前面label的宽度,你改一下就行了
      

  6.   


    var form_11 = createDatefield('授信额度注销生效日期', '11', false);   // 创建表单元素 - 日期选择
    function createDatefield(labelname, name, allowBlank,labelWidth) {    var obj = Ext.create('Ext.form.DateField', {
            fieldLabel: labelname,
            labelAlign: 'right',
            allowBlank: allowBlank,
            format: 'Y-m-d',
            name: name,
            labelwidth:labelWidth
        });    return obj;
    }