CODEWITHSUNDEEP
domextjs
barbacan
barbacan

Reputation: 632

ExtJs - Render object 'layout form' dynamically in DOM

I have a function :

var my_form = function() {
    return {
        layout:'form',
        items: [
            {
                xtype:'textfield',
                fieldLabel: "Name",
                maxLength: 255
            }
        ]
    };
}

I want to render it dynamically. This doesn't work :

var t = Ext.DomHelper.createTemplate(my_form()).compile();
Ext.DomHelper.insertBefore('my_div', t);

How to do this ?

Thanks :)

Upvotes: 0

Views: 1410

Answers (1)

Paolo Stefan
Paolo Stefan

Reputation: 10263

I found out it can work this way: first create a div via DomHelper, then create the FormPanel using the "renderTo" config option.

Ext.onReady(function(){

    var formdiv = Ext.DomHelper.insertBefore('my_div', {tag: 'div', id: 'form_div' } );

    var my_form = function() {
        return {
            layout:'form',
            renderTo:'form_div',
            items: [
                {
                    xtype:'textfield',
                    fieldLabel: "Name",
                    maxLength: 255
                }
            ]
        };
    }

    var t = new Ext.FormPanel(my_form());

});

Upvotes: 1

Related Questions