1. #1
    Ext User Lukman's Avatar
    Join Date
    Jun 2009
    Location
    Malaysia
    Posts
    138
    Vote Rating
    0
    Lukman is on a distinguished road

      0  

    Default Ext.ux.TabURL

    Ext.ux.TabURL


    This little plugin for TabPanel allows you to set each tab to have specific middle-click URL (for browsers that support middle-clicking hyperlinks to open in new tabs e.g. Firefox).

    Add this plugin into TabPanel's plugins config option and for each Panel that makes up the children of the TabPanel add tabURL: 'url here' config option.

    Code:
    /**
      * Ext.ux.TabURL - Adding URL to TabPanel for launching specific URL when tabs are middle-clicked (in browsers that support opening URL by middle-clicking)
      * @author  M.Lukman
      * @version 0.2
      */
    
    Ext.ux.TabURL = Ext.extend(Object, {
        init: function(tabpanel) {
            var tt = new Ext.Template(
                 '<li class="{cls}" id="{id}"><a class="x-tab-strip-close" onclick="return false;"></a>',
                 '<a class="x-tab-right" {hrefurl} onclick="return false;"><em class="x-tab-left">',
                 '<span class="x-tab-strip-inner"><span class="x-tab-strip-text {iconCls}">{text}</span></span>',
                 '</em></a></li>'
            );
            tt.disableFormats = true;
            tt.compile();
            tabpanel.itemTpl = tt;
            tabpanel.getTemplateArgs = function(item) {
                return Ext.apply({}, {
                    hrefurl: item.tabURL? 'href="'+item.tabURL+'"' : ''
                }, Ext.TabPanel.prototype.getTemplateArgs.call(tabpanel, item));
            }
        }
    });
    Ext.preg('taburl', Ext.ux.TabURL);
    Example usage:
    Code:
    var tabpanel = new Ext.TabPanel({
       plugins: [ Ext.ux.TabURL ]
    });
    
    tabpanel.add({
       title: 'Debugger',
       tabURL: '?module=debugger'
    });
    
    tabpanel.add({
       title: 'Google',
       tabURL: 'http://www.google.com'
    });
    Bonus: using this plugin will remove the default href="#" from the tabs that do not specify tabURL config option

  2. #2
    Ext User IHaveRead's Avatar
    Join Date
    Jun 2009
    Posts
    7
    Vote Rating
    0
    IHaveRead is on a distinguished road

      0  

    Default


    The thing i was looking for, many thanks!

Thread Participants: 1