ExtJs crée dynamiquement un panneau de formulaire à partir d'un enregistrement de magasin de données

Question

J'essaie de remplir dynamiquement un formulaire FormPanel ExtJs à partir d'un enregistrement de magasin de données. Lorsque l'utilisateur clique sur une ligne dans le GridPanel, la méthode buildForm est appelée et l'enregistrement cliqué est envoyé comme premier argument.

Le code ci-dessous (lors du débogage) semble fonctionner, mais la méthode doLayout n'a pas d'effet.

Quelqu'un peut-il me diriger dans la bonne direction?

mymodule = Ext.extend(Ext.FormPanel, { 
    forceLayout: true, 
    initComponent: function() { 
     Ext.applyIf(this, { 
      id: Ext.id(), 
      labelWidth: 75, 
      defaultType: 'textfield', 
      items: [{ 
       layout: 'form', 
       items: [{ 
        fieldLabel: 'test', 
        xtype: 'textfield' 
       }, { 
        fieldLabel: 'test', 
        xtype: 'textfield' 
       }] 
      }] 
     }); 
     mymodule.superclass.initComponent.call(this); 
    }, 
    buildForm: function (record, c) { 
     var form = this.getForm(); 

     var formItems = new Ext.util.MixedCollection(); 

     Ext.each(record.fields.items, function (item) { 
      formItems.add(new Ext.form.TextField({ 
       labelStyle: 'width:100px', 
       fieldLabel: item.name, 
       name: item.dataIndex, 
       id: 'field-' + item.name 
      })); 
     }, this); 

     form.items = formItems; 

     this.doLayout(false, true); 

     form.loadRecord(record); 
    } 
}); 

Answer 1

La bonne façon d'ajouter des composants à la forme serait d'utiliser la méthode add(). Si votre formulaire est déjà affiché, utilisez la méthode add(), puis appelez le doLayout().

Vous pourriez vouloir essayer ceci:

form.add(formItems); 
form.doLayout(false,true); 
form.loadRecord(record);