Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Ext JS Premium Member
    Join Date
    Jul 2011
    Posts
    46
    Vote Rating
    4
    adrianmirjan is on a distinguished road

      0  

    Post Add event is fired twice on TabPanel

    Add event is fired twice on TabPanel


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.1.0 GA & 4.1.1-rc2
    Browser versions tested against:
    • Google Chrome 19
    • FF13 (firebug 1.9.2 installed)
    DOCTYPE tested against:
    • HTML5
    Description:
    • I did search on the forum, but could not find any relevant ticket. The ADD event is fired twice in the code sample below.
    • If there are heavy calculations or some other logic happens on TabPanel 'add' event, then it will be invoked twice.
    Steps to reproduce the problem:
    • On Add event of TabPanel do some console logging.
    • Add a simple Panel to a TabPanel.
    The result that was expected:
    • The Add event is fired once.
    The result that occurs instead:
    • The Add event was fired twice.
    Test Case:


    Code:
    var tabPanel = Ext.create('Ext.tab.Panel', {
        width: 400,
        height: 400,
        renderTo: document.body,
        listeners: {
             add: function(container, component, index, eOpts) {
                 console.debug('tabpabel onAdd', component);
             }
        }
    });
    
    tabPanel.add(Ext.ComponentManager.create({
        xtype: 'panel',
        title: 'tab1'
    }));

    HELPFUL INFORMATION

    See this URL for live test case:
    http://docs.sencha.com/ext-js/4-1/#!/api/Ext.tab.Panel

    Debugging already done:
    • The first event is fired on adding a Tab to the TabPanel.
    Possible fix:
    • I'm not sure if this should be classified as a bug, but I'm looking for a way to invoke some method only once if a Panel is added to a TabPanel. Perhaps a different event?!
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • Windows 7 Pro SP1 x64

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,927
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    If you look at the objects, you are seeing that each event is for each component added:
    button/panel

    .. and per the API:

    This event bubbles: 'add' will also be fired when Component is added to any of the child containers or their childern or ...
    Scott.

  3. #3
    Ext JS Premium Member
    Join Date
    Jul 2011
    Posts
    46
    Vote Rating
    4
    adrianmirjan is on a distinguished road

      0  

    Default


    Hi Scott,

    Thanks for the reply.
    What event should I listen to if some Component (like Panel) is added to TabPanel?
    I'm not interested if Tab is added to TabPanel.

  4. #4
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,927
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You can check the type of object that is added since both a triggered.

    Scott.

  5. #5
    Ext JS Premium Member
    Join Date
    Jul 2011
    Posts
    46
    Vote Rating
    4
    adrianmirjan is on a distinguished road

      0  

    Default


    This has been fixed now. In ExtJS 4.2.1.883 when panel is added to TabPabel add event is only triggered once for the panel and not for the added tab/button. Thanks!

Thread Participants: 1