Return to Snippet

Revision: 25951
at April 14, 2010 15:02 by tbelknap


Initial Code
/*/////////////////////////////////////////
// oesCloseTab: Closes the selected tab. //
/////////////////////////////////////////*/
jQuery.fn.oesCloseTab = function(elm) {
	var index = $('li').index($(elm).parent());
	$("#tabs").tabs('remove', index);
}

// To add this function to a tab, do this:
var closer = $("<span class='ui-icon ui-icon-close'>Remove Tab</span>").click(function(){
	$().oesCloseTab(this);
});
$("#tabs yourULselector").find("li:last").append(closer);

Initial URL


Initial Description
Sometimes, you need a jQuery tab that will close. Finding the right way to do that has been a challenge for me, personally. This is especially true when you are adding new tabs dynamically. The trick is getting the proper index of the closable element when its time to close.

Initial Title
A Closable jQuery UI Tab

Initial Tags
jquery

Initial Language
jQuery