Tabs: Added context to global selectors. Fixed #6710 - tabs module uses global select...

diff --git a/tests/unit/tabs/tabs_tickets.js b/tests/unit/tabs/tabs_tickets.js
index fdc2295e9cb7e8a6a8f1bdad3deaea40ce11c0af..4a09d59e4296b19b9af133e4139f00925058acc7 100644 (file)
--- a/tests/unit/tabs/tabs_tickets.js
+++ b/tests/unit/tabs/tabs_tickets.js
@@ -91,4 +91,25 @@ asyncTest( "#4581 - title attribute for remote tabs does not support foreign lan
        });
 });
 
+
+test('#6710 - selectors are global', function() {
+       // http://bugs.jqueryui.com/ticket/6710
+       expect(1);
+
+       var container = $('\
+               <div>\
+                       <div id="tabs_6710">\
+                       <ul>\
+                               <li><a href="#tabs-1_6710">Nunc tincidunt</a></li>\
+                               <li><a href="#tabs-2_6710">Proin dolor</a></li>\
+                       </ul>\
+                       <div id="tabs-1_6710"> <p>first</p> </div>\
+                       <div id="tabs-2_6710"> <p>second</p>\
+               </div>\
+       </div>');
+       container.find('#tabs_6710').tabs();
+       ok( container.find('#tabs-2_6710').hasClass('ui-tabs-hide'),  'should find panels and add corresponding classes' );
+});
+
+
 })(jQuery);

diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js
index ad99a99b782990286fc6464ec2382ec26389b55f..7c615c8727be216cf498aadeed5dd1c38282d296 100644 (file)
--- a/ui/jquery.ui.tabs.js
+++ b/ui/jquery.ui.tabs.js
@@ -126,7 +126,7 @@ $.widget( "ui.tabs", {
 
                        // inline tab
                        if ( fragmentId.test( href ) ) {
-                               self.panels = self.panels.add( self._sanitizeSelector( href ) );
+                               self.panels = self.panels.add( self.element.find( self._sanitizeSelector( href ) ) );
                        // remote tab
                        // prevent loading the page itself if href is just "#"
                        } else if ( href && href !== "#" ) {
@@ -139,7 +139,7 @@ $.widget( "ui.tabs", {
 
                                var id = self._tabId( a );
                                a.href = "#" + id;
-                               var $panel = $( "#" + id );
+                               var $panel = self.element.find( "#" + id );
                                if ( !$panel.length ) {
                                        $panel = $( o.panelTemplate )
                                                .attr( "id", id )
@@ -210,13 +210,13 @@ $.widget( "ui.tabs", {
                        this.lis.removeClass( "ui-tabs-selected ui-state-active" );
                        // check for length avoids error when initializing empty list
                        if ( o.selected >= 0 && this.anchors.length ) {
-                               $( self._sanitizeSelector( self.anchors[ o.selected ].hash ) ).removeClass( "ui-tabs-hide" );
+                               self.element.find( self._sanitizeSelector( self.anchors[ o.selected ].hash ) ).removeClass( "ui-tabs-hide" );
                                this.lis.eq( o.selected ).addClass( "ui-tabs-selected ui-state-active" );
 
                                // seems to be expected behavior that the show callback is fired
                                self.element.queue( "tabs", function() {
                                        self._trigger( "show", null,
-                                               self._ui( self.anchors[ o.selected ], $( self._sanitizeSelector( self.anchors[ o.selected ].hash ) ) ) );
+                                               self._ui( self.anchors[ o.selected ], self.element.find( self._sanitizeSelector( self.anchors[ o.selected ].hash ) ) ) );
                                });
 
                                this.load( o.selected );
@@ -337,7 +337,7 @@ $.widget( "ui.tabs", {
                        var el = this,
                                $li = $(el).closest( "li" ),
                                $hide = self.panels.filter( ":not(.ui-tabs-hide)" ),
-                               $show = $( self._sanitizeSelector( el.hash ) );
+                               $show = self.element.find( self._sanitizeSelector( el.hash ) );
 
                        // If tab is already selected and not collapsible or tab disabled or
                        // or is already loading or click callback returns false stop here.
@@ -496,7 +496,7 @@ $.widget( "ui.tabs", {
                $li.addClass( "ui-state-default ui-corner-top" ).data( "destroy.tabs", true );
 
                // try to find an existing element before creating a new one
-               var $panel = $( "#" + id );
+               var $panel = self.element.find( "#" + id );
                if ( !$panel.length ) {
                        $panel = $( o.panelTemplate )
                                .attr( "id", id )
@@ -630,7 +630,7 @@ $.widget( "ui.tabs", {
                this.xhr = $.ajax( $.extend( {}, o.ajaxOptions, {
                        url: url,
                        success: function( r, s ) {
-                               $( self._sanitizeSelector( a.hash ) ).html( r );
+                               self.element.find( self._sanitizeSelector( a.hash ) ).html( r );
 
                                // take care of tab labels
                                self._cleanup();