1. #1
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      0  

    Default Unanswered: Inheritance from customized component

    Unanswered: Inheritance from customized component


    I am not sure how to realize inheritance from a customized component.

    For example, i have a dummy component that will write out the basic skeleton, into which all children components need to be able to add new component.

    The dummy component is as such:

    Code:
    Ext.define('Ext.csx.modules.baseCmp', {
        extend: 'Ext.Component',
        initComponent: function () {
    
    
            this.renderTpl = new Ext.XTemplate(
                    '<div>',
                        '<div class="moduleHeaderWrapper">',
                            '<div id="{id}-module-header" class="moduleHeader"><h1>{title}</h1></div>',
                        '</div>',
                        '<div class="vBuffer10"><div></div></div>',
                        '<div class="moduleBodyWrapper" id="{id}-module-body">',
                        '</div>',
                    '</div>'
                );
    
    
            this.childEls = ["module-header", "module-body"];
            this.callParent();
        }
    });
    
    Now a dummy child:
    
    Ext.define('Ext.csx.modules.TabbedModule', {
        extend: 'Ext.csx.modules.baseCmp',
    
    
        activeCls: 'active',
    
    
    
    
        initComponent: function () {
    
    
            console.log("tabbed init");
    
    
          
            this.renderTpl = '<div id="test1"></div><div id="test2"></div>';
           
            this.tabs = new Ext.util.MixedCollection();
            this.callParent();
        },
    
    
        afterRender: function () {
            console.log("tabbed after render");
            console.log(this.childEls);
            this.callParent();
        }
    });
    How can i have the child component render its own customized tpl into either the header of the base component?

    Thanks
    Last edited by mitchellsimoens; 13 Mar 2012 at 10:09 AM. Reason: added [CODE] tags

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,347
    Answers
    3542
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The base component should look for a new config that the subclasses can set.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      0  

    Default


    thanks. can you elaborate?

Thread Participants: 1