Form Repeater

[d0uble_hel1x]

hi there,

im trying to subclass Ext.view.View to repeat a form panel.

To achieve this i would add a record into the view's store and then intercept the onAdd function to instantiate the form and render it into the containing div. everything seems alright but im still not able to get the form the show up.

below is the code. thx!

var SC={}

Ext.define('SC.RepeaterFormModel', {
    extend: 'Ext.data.Model',
    fields: [{name:'id'},{name: 'formobj'}]
});
    
SC.RepeaterFormStore = Ext.define('SC.RepeaterFormStore',{
    extend:'Ext.data.Store',
    model: 'SC.RepeaterFormModel'
});

Ext.define('SC.RepeaterFormView',{
    extend:'Ext.view.View',
    store: new SC.RepeaterFormStore(),
    multiSelect: true,    
    trackOver: true,
    overItemCls: 'x-item-over',    
    tpl: '<tpl for="."><div class="repeaterform-wrap" id="{id}"> <br> <br> </div></tpl>',
    itemSelector: 'div.repeaterform-wrap',
    
    constructor:function(config){
        config = config || {};
        config.form = config.form || {};
        this.form = config.form;
        this.callParent();
    },
    
    onAdd: function(ds, records, index) {
        
        this.callParent(arguments);
        
        var i=0;
        
        if (i==1){
            // adding to the west region is ok
            var container = Ext.getCmp('west-region-container');
            var f = new this.form();
            container.add(f);
            f.show();
            console.log('onAdd ' + records[index].data.id);        
        }
        else{
            var id = records[index].data.id;
            var el = Ext.get(id);
            
            if (el){
                console.log('el ' + id + ' was found : ' , el);
                var f = new this.form({renderTo:records[index].data.id});
                f.show();
                f.doLayout();
                console.log(f);
            }
            else{
                console.log('el ' + id + ' not found');        
            }
        }
    },

    
    addForm:function(){
        this.store.add({id : Ext.id()})
    },
    
    afterRender : function(){
        console.log('afterRender');
        this.callParent();
        this.addForm();
    }
})


Ext.define('SC.RepeaterFormPanel',{
    extend:'Ext.Panel',
    frame: true,
    width: 535,
    height: 310,
    title : 'Professional Experience',
    constructor:function(config){
        config = config || {};
        config.form = config.form || {};
        config.items = [new SC.RepeaterFormView(config)]
        this.callParent([config]);
    }
})