Hinzufügen von Textbereich zu Container extjs

Question

Ich habe Probleme beim Hinzufügen von Textbereich zu Container dynamisch.

Anfängliche Schaffung Behälter:

xtype: 'container', 
    layout: 'form', 
    width: 400, 
    ref: 'form', 
    layoutConfig: { 
     labelSeparator: ' ', 
     trackLabels: true 
    }, 
    items: [{ 
     xtype: 'textarea', 
     value: 'test', 
     fieldLabel: 'label', 
     anchor: '100%', 
     submitValue: false, 
     readOnly: true, 
     ref: '../field_1', 
     id: 'field_1' 
    }] 
} 

Dynamische Code:

for (i = 4; i < obj.length; i++) { 
    var id = i + 12; 
    id = 'field_' + id; 
    var field = newTextArea(id); 
    field.setValue(obj[i].value); 
    field.setVisible(true); 
    this.form.add(field); 
} 

Funktion Textbereich zu erstellen:

function newTextArea(id) { 
    var text_Area = new Ext.form.TextArea({ 
     fieldLabel: 'Test', 
     height: 30, 
     width: 250, 
     submitValue: false, 
     readOnly: true, 
     autoScroll: true, 
     id: id 
    }); 
    return text_Area; 
} 

Problem:

Wenn ich debuggen und sehen bilden, Textarea wird in Formularelementen hinzugefügt, aber nicht im Browser angezeigt. Kann jemand vorschlagen, was zu tun ist?

Grüße,

Raj

Answer 1

prüfen diese simple fiddle.

Nicht sicher, was ist falsch mit Ihrem Code, Sie nicht erwähnen, was ist obj und ich denke, dass this.form ist ein falscher Verweis auf den Container. Ich denke, man kann ähnlich Ext.ComponentQuery.query oder etwas verwenden (wie up und down Methoden für queryable Komponenten).

Answer 2

In extjs 3.x, haben Sie doLayout nach Hinzufügen von Elementen zu einem Behälter rufen.

for (i = 4; i < obj.length; i++) { 
    var id = i + 12; 
    id = 'field_' + id; 
    var field = newTextArea(id); 
    field.setValue(obj[i].value); 
    field.setVisible(true); 
    this.form.add(field); 
} 

this.form.doLayout();