Fields are added dynamically to the form but not submitted to the server

Question

I want to be able to add different fields to the form on the fly and then submit them to the server. This is how I do that:

var frm = this.up('window').down('form');
for(var i = 0; i < 3; i++){
    var el = Ext.create('Ext.form.field.Text',{
                 xtype:'textfield',
                 name:'field_' + i
             });
    frm.items(add);
}
alert(frm.getForm().getFields().length); // alerts "0";

It is really interesting, because I even see three new fields in the form - they have their unique ids, names, etc. But for some insane reason frm.getForm().getFields().length gives me zero, even if I defer this by 2, 5 or infinity seconds. What is going on???

Answer 1

Try:

frm.add(el);

Instead of:

frm.items(add);