1. #1
    Sencha User
    Join Date
    Mar 2011
    Location
    Germany
    Posts
    198
    Vote Rating
    1
    Nickname is on a distinguished road

      0  

    Default [4.0.2a] Overwrite: Ext.tab.Bar onClose jump to previous Tab

    [4.0.2a] Overwrite: Ext.tab.Bar onClose jump to previous Tab


    Hi

    When I use Ext.tab.Panel and close one of multiple Tabs, it always focus the first Tab in the tabbar instead of the previous Tab. So I used Ext.overwrite and if I now close a tab with the close icon the previous focused Tab is than set as active tab, instead of the first in the tabbar.

    Maybe there is a better and smarter way to implement this behavior. Optimizations welcome!

    PHP Code:

    Ext
    .override(Ext.tab.Bar, {
        
    /**
         * @private
         * Marks the given tab as active
         * @param {Ext.Tab} tab The tab to mark active
         */
        
    setActiveTab: function(tab) {
            if (
    tab.disabled) {
                return;
            }
            var 
    me this;
            if (
    me.activeTab) {
                
    me.previousTab me.activeTab;  // new line
                
    me.activeTab.deactivate();
            }
            
    tab.activate();

            if (
    me.rendered) {
                
    me.layout.layout();
                
    tab.el.scrollIntoView(me.layout.getRenderTarget());
            }
            
    me.activeTab tab;
            
    me.fireEvent('change'metabtab.card);
        },

        
    /**
         * @private
         * Closes the given tab by removing it from the TabBar and removing the corresponding card from the TabPanel
         * @param {Ext.Tab} tab The tab to close
         */
        
    closeTab: function(tab) {
            var 
    me this,
                
    card tab.card,
                
    tabPanel me.tabPanel,
                
    nextTab;
                
            if (
    card && card.fireEvent('beforeclose'card) === false) {
                return 
    false;
            }

            if (
    tab.active && me.items.getCount() > 1) {
    //            nextTab = tab.next('tab') || me.items.items[0]; // old line
                
    nextTab me.previousTab || tab.next('tab') || me.items.items[0]; // new line
                
    me.setActiveTab(nextTab);
                if (
    tabPanel) {
                    
    tabPanel.setActiveTab(nextTab.card);
                }
            }
            
    /*
             * force the close event to fire. By the time this function returns,
             * the tab is already destroyed and all listeners have been purged
             * so the tab can't fire itself.
             */
            
    tab.fireClose();
            
    me.remove(tab);

            if (
    tabPanel && card) {
                
    card.fireEvent('close'card);
                
    tabPanel.remove(card);
            }
            
            if (
    nextTab) {
                
    nextTab.focus();
            }
        }
    }); 
    (my changes are red bold)

    Edit: Colors in PHP Tags do not work, so added comments in code (1 new line, 1 modifed line)

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    35,677
    Vote Rating
    749
    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


    Quote Originally Posted by Nickname View Post
    Edit: Colors in PHP Tags do not work, so added comments in code (1 new line, 1 modifed line)
    Colors work in CODE tags

    Nice work, this has been an improvement reported so it will probably make it into the framework soon or later
    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 2009
    Posts
    99
    Vote Rating
    1
    EZboy is on a distinguished road

      0  

    Default


    It seems like this made into 4.1.0 b2, but it absolutely does not work.

    How to repeat: use "Advances Tabs" example, add couple of closeable tabs using the button provided, close them one by one. Note: "Tab 1" will be active after every time you close another tab

    Here is something i came up with:

    This will focus the tabs in order they were opened. I tested the code with 4.1.0b2, not sure if it will work with 4.0.X

    Code:
    Ext.override(Ext.tab.Bar, { 
    
    
            setActiveTab: function(tab) {
            if (tab.disabled) {
                return;
            }
            var me = this;
            if (me.activeTab) {
                // me.previousTab = me.activeTab; //changed here
                me.activeTab.deactivate();
            }
            console.log('activating tab:');
            console.log(tab);
            tab.activate();
    
            me.activeTab = tab;
            me.fireEvent('change', me, tab, tab.card);
        },
        
        onAdd: function(tab) {
            var me = this;
            me.previousTab = tab;//added here
            tab.position = this.dock;
            this.callParent(arguments);
        },
        
        onRemove: function(tab) {
            var me = this;
            
            if (tab === me.previousTab) {
                //me.previousTab = null; //changed here
                me.previousTab = me.items.last();//added here
            }
            
            if (tab === me.activeTab) {
                me.activeTab = null;
            }
            
            if (me.items.getCount() === 0) {
                me.activeTab = null;
            }
            me.callParent(arguments);    
        }
        
    });

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar