Extjs component inside Ext.XTemplate on EXTJS 4

components, extjs, extjs4, render

Solution

Try this

Ext.create('Ext.panel.Panel', {
    renderTo: Ext.getBody(),
    data: {},
    listeners: {
        refresh: function() {
            var renderSelector = Ext.query('div.comment-add-textarea');
            for (var i in renderSelector) {
                Ext.create('Ext.form.field.TextArea', {
                    height: 300,
                    renderTo: renderSelector[i]
                });
            }
        }
    },
    tpl: Ext.create('Ext.XTemplate',
        '<tpl for=".">',
        '<div class="comment-add-textarea"></div>',
        '</tpl>', {
            compiled: true
    })
});

Problem

I'm trying to add extjs components to tpl panel. Is there anyway to insert component to tpl like this ``` Ext.create('Ext.panel.Panel',{ renderTo: Ext.getBody(), data: {}, listeners:{ afterrender:function(){ var renderSelector = Ext.query('div.comment-add-textarea'); for(var i in renderSelector){ Ext.create('Ext.form.field.TextArea',{ height:300, renderTo:renderSelector[i] }); } } }, tpl: Ext.create('Ext.XTemplate', '<tpl for=".">', '<div class="comment-add-textarea"></div>', '</tpl>',{ compiled:true }) });​ ```

Original source