tabs(): allow more flexibility in specifying what list is used

[cjwilks]

I would like to propose adding an option to ui.tabs that allows a person to more flexibly configure what ul should be used. That option would provide an alternate list element for the tab navigation bar. In the diff and usage example below, I've named the option ul.

ui.tabs.js

@@ -71 +71 @@
 
        _tabify: function(init) {
 
-               this.list = this.element.children('ul:first');
+               this.list = this.options.ul || this.element.children('ul:first');
                this.lis = $('li:has(a[href])', this.list);
                this.anchors = this.lis.map(function() { return $('a', this)[0]; });
                this.panels = $([]);

Usage:

$("div#mytabs").tabs({
    ul: $("#someotherlist")  //use this other list as the tab nav
  });

In versions prior to 1.7.x the tabs() plugin targeted a ul directly. But the current code now expects a div that contains a ul as a direct child. This may fit in better with themeroller widget styles, but it does not always yield the layout a designer wants. (The ul may need to be wrapped in other intermediate elements, or it may need to be outside of the tab content pane entirely.)

[Jörn Zaefferer]

Sounds reasonable. Spec needed to decide how to handle this with regards to themes.

[Jörn Zaefferer]

Related to #4501.

[klaus.hartl]

The ul does not need to be in the tab content pane at all.

[Scott González]

The ul does currently have to be a direct child of the container. We should be able to remove this restriction while still requiring the nav to be the first ul in the container.

[Scott González]

Fixed in r3421. The first descendant list found will be used now.