如何呈现Ext.form.TextArea的响应

时间:2017-10-12 09:12:37

标签: extjs extjs3

我需要一些关于带有textarea字段的表单的帮助。

我的问题。

我有一个简单的Ext.window,我在其中放置了一个Ext.FormPanel。在这个Ext.FormPanel中,我放了一个Ext.form.FieldSet,其中放了一些字段。其中一个字段是textarea(Ext.form.TextArea), 现在,我的目标是在调整Ext.window时调整此textarea的响应。

有可能获得这种行为吗?

这是我目前的代码:

其中驻留Ext.FormPanel的窗口

var    win = new Ext.Window({
    id:'winTest',
    layout:'fit',
    modal:true,
    title:'Title',
    width:590,
    height:300,
    closeAction:'close',
    plain: true,
    autoScroll: true,
    items:[form],
    listeners: {
        'beforeclose': function (p) {
        }
    }
});

Ext.FormPanel,其中包含Ext.form.FieldSet

var form = new Ext.FormPanel({
    id:'FormTest',
    layout : 'form',
    width:510,
    labelAlign: 'right',
    labelWidth: 120,
    autoScroll:true,
    bodyStyle:'padding:2px;background-color:#E9EFF8;',
    monitorValid:true,
    waitMsgTarget: true,
    border: true,
    bodyBorder: true,
    trackResetOnLoad:true,
    items: [fieldset]
});

我放置了一些文件的字段集

var fieldset = Ext.form.FieldSet({
    id:'fsTest',
    autoHeight: true,
    defaultType: 'textfield',
    items:[.....,textarea]
    //boxMaxWidth:450
    //border:true    
})

Textarea推出了字段集(简称,我只报告了textarea)

var textarea = new Ext.form.TextArea({
    id:'textareaTest',
    name:'TextArea',
    fieldLabel:'Insert',
    hidden:false,
    width:310,
    height:60,
    maxLength:500,
    allowBlank: true
});

感谢您的宝贵帮助。

洛伦佐。

1 个答案:

答案 0 :(得分:-1)

应该是这样的: -

var win = new Ext.Window({
    id: 'winTest',
    layout: 'vbox',
    modal: true,
    title: 'Title',
    width: 590,
    height: 300,
    closeAction: 'close',
    plain: true,
    autoScroll: true,
    items: [{
        xtype: 'form',
        id: 'FormTest',
        flex: 1,
        layout: 'vbox',
        width: 510,
        labelAlign: 'right',
        labelWidth: 120,
        autoScroll: true,
        bodyStyle: 'padding:2px;background-color:#E9EFF8;',
        monitorValid: true,
        waitMsgTarget: true,
        border: true,
        bodyBorder: true,
        trackResetOnLoad: true,
        items: [{
            xtype: 'fieldset',
            id: 'fsTest',
            //autoHeight: true,
            flex: 1,
            layout: 'vbox',
            //defaultType: 'textfield',
            items: [{
                    xtype: 'textarea',
                    flex: 1,
                    id: 'textareaTest',
                    name: 'TextArea',
                    fieldLabel: 'Insert',
                    hidden: false,
                    width: 310,
                    //height: 60,
                    maxLength: 500,
                    allowBlank: true
                }]
                //boxMaxWidth:450
                //border:true
        }]
    }]
}).show();

请查看此example