Choose tab index while adding new tab

[leela]

Hi,

 Is there a way I can define the index of the tab, when adding it, so that I can control the position/sequence of the newly added tab

 Example: Lets I have 2 tabs added already tab X and tab Y.

 I need to add a new tab Z in between the 2 existing tabs X and Y

 Right now it always goes after tab Y

 Please advise.


Thanks,
Leela.

[Opan Mustopah]

did you already try onAdd event? with that, i think you can get the tab index.

[aswzen]

i can't figure out how to do that...
and i find there is no Drag and Drop feature on tabs , too bad
 
maybe stworthy could solve your problem..

this is my best..just a little bit weird..

take a look here...
http://jsfiddle.net/aswzen/jfqL65o6/

[Opan Mustopah]

yes, actually i wait for that feature too sir. i hope it included in next release.

[stworthy]

Please extend the 'move' method to achieve this functionality.

Code:

$.extend($.fn.tabs.methods, {
	move: function(jq, param){
		return jq.each(function(){
			moveTab(this, param);
			function moveTab(target, param){
				var state = $.data(target, 'tabs');
				var opts = state.options;
				var tabs = state.tabs;

				if (param.index < 0){param.index = 0}
				if (param.index > tabs.length){param.index = tabs.length}

				var ul = $(target).children('div.tabs-header').find('ul.tabs');
				var li = $(param.tab.panel('options').tab);
				if (param.index >= tabs.length){
					var tabIndex = $(target).tabs('getTabIndex', param.tab);
					tabs.splice(tabIndex, 1);
					tabs.push(param.tab);
					li.appendTo(ul);
				} else {
					var pp = [];
					$.map(tabs, function(tab, index){
						if (index == param.index){
							pp.push(param.tab);
						} 
						if (tab[0] != param.tab[0]){
							pp.push(tab);
						}
					});
					state.tabs = pp;
					li.insertBefore(ul.children('li:eq('+param.index+')'));
				}
			}
		});
	}
})

Usage example:

Code:

var t = $('#tt');
var tab = t.tabs('getTab', 2);  // get the tab panel
t.tabs('move', {
  tab: tab,
  index: 1  // move to index 1
});