Ext.formPanel使用关闭按钮复制内容

时间:2017-06-28 15:46:39

标签: javascript extjs extjs3

我正在使用ExtJS 3.2(必须在此版本的ExtJS中)。当我显示一个带有formpanel的面板时,一切看起来都很好,但当我用顶部的[X]按钮关闭面板并再次打开时,每个fieldlabel出现两次,文本字段消失。如果我使用“Cancelar”按钮,则显示正确。

How shows the first time

Error

我的代码:

    function crearDoc(idControl) {
        f = new Ext.FormPanel({
            frame: true,
            id: 'formFicheroCrear',
            layout: 'fit',
            defaults: {minWidth: 500},
            items: [{
                      xtype : 'hidden',
                      id : 'idFichero'
                   },
                    {
                       xtype: 'panel',
                       layout: 'form',
                       id: 'formReal',
                       width: '100%',
                       items: [{xtype: 'datefield',
                               disabled: true,
                               allowBlank : false,
                               fieldLabel: 'Fecha',
                               value : new Date(),
                               format: 'd/m/Y',
                               width: '100%',
                               id: 'fechaDoc',
                               allowBlank: false},
                          {xtype: 'textfield',
                           fieldLabel: 'Titulo',
                           allowBlank : false,
                           width: '100%',
                           id: 'nombreDoc'},
                          {xtype: 'textfield',
                            fieldLabel: 'Descripcion',
                            allowBlank : false,
                            width: '100%',
                            id: 'descripcionDoc'}]
                   },{xtype: 'panel',
                       layout   : 'fit',
                       items: [{xtype: 'htmleditor',
                           id: 'editorHTML',
                           allowBlank : false,
                           name: 'documentoTexto'}]
                   }],
            buttons: [{
                //Guardar documento SGSI
                text: '<bean:message key="label.boton.guardarySubir"/>',
                minWidth: 100,
                cls : 'x-btn-text-icon',
                iconCls : 'yes-icon',
                listeners:{
                    'close':function(win){
                             console.info('bye');
                     },
                    'hide':function(win){
                             console.info('just hidden');
                     }

            },
                handler: function() {
                    // Comprobamos que el formulario esté OK
                    if (f.getForm().isValid()) {
                       var nombreDoc =  Ext.getCmp("nombreDoc").getValue();
                       var descripcionDoc =  Ext.getCmp("descripcionDoc").getValue();
                       var editorHTML =  Ext.getCmp("editorHTML").getValue();

                         Ext.Ajax.request(
                                 {
                    url: '/<bean:message key="global.application.context.name"/>/SGSI.do',
                    params: {"method": "crearDocumento",
                           "docTitulo": nombreDoc,
                           "docDescripcion" : descripcionDoc,
                           "docCuerpo" : editorHTML,
                           "idProyecto" :  Ext.getCmp('idProyecto').getValue(),
                           "idControl" : idControl}
                    })
                    ventanaCrearDocumento.close()
                    storeDocumentos.loadData(json);
                    Ext.getCmp('formFichero').getForm().reset()
                    } else {
                        Ext.Msg.alert('<bean:message key="label.sincronizador.atencion"/>',
                                        '<bean:message key="label.error.campos.rojo"/>');
                    }

                }},
                { text : '<bean:message key="label.boton.cancelar"/>',
                    cls : 'x-btn-text-icon',
                    iconCls : 'no-icon',
                    minWidth: 100,
                    handler: function() {ventanaCrearDocumento.close()}}]
        });

        f.load({
            url : '/<bean:message key="global.application.context.name"/>/SGSI.do',
            params : {
                "method" : 'dameControlPorId',
                "idControl" : idControl,
                "idProyecto" : Ext.getCmp('idProyecto').getValue()
            },
            method : 'POST'
        });
    var ventanaCrearDocumento = new Ext.Window({
            height: 460,
            width: 700,
            closable: true,
            closeAction : 'hide',
            modal: true,
            title: 'Redacción de Documento',
            layout: 'fit',
            items: f
        });
        ventanaCrearDocumento.show();
 }

2 个答案:

答案 0 :(得分:1)

您已指定closeAction : 'hide',这就是为什么它不会自动销毁。 将该属性指定为close将解决问题。

答案 1 :(得分:0)

您正在通过调用函数crearDoc(idControl)来创建新的表单对象。按下关闭按钮时需要销毁它,所以设置autoDestroy:true。  或定义表单并将其设置为隐藏并在单击按钮上显示表单。