From 31341bab4de0e9cfbd8a9640b243773ca4bb1278 Mon Sep 17 00:00:00 2001 From: jenters Date: Wed, 29 Sep 2010 12:32:43 -0500 Subject: [PATCH] Tab: modified init to display correct content of misordered div when hash present in url. Fixed #6125 - Incorrect selection of tab on init with hash in url and misordered divs --- tests/unit/tabs/tabs.html | 10 ++++++++- tests/unit/tabs/tabs_methods.js | 36 +++++++++++++++++++++++++++++++++ ui/jquery.ui.tabs.js | 4 ++-- 3 files changed, 47 insertions(+), 3 deletions(-) diff --git a/tests/unit/tabs/tabs.html b/tests/unit/tabs/tabs.html index aa79ddabb69..115a931f0f1 100644 --- a/tests/unit/tabs/tabs.html +++ b/tests/unit/tabs/tabs.html @@ -61,7 +61,7 @@

  • 1
  • 2
  • 3
    • -
  • 4
    • +
  • 4
    • @@ -107,6 +107,14 @@

    +
    + +
    +
    +
    diff --git a/tests/unit/tabs/tabs_methods.js b/tests/unit/tabs/tabs_methods.js index 3812c3e917f..67a4d9b4792 100644 --- a/tests/unit/tabs/tabs_methods.js +++ b/tests/unit/tabs/tabs_methods.js @@ -21,6 +21,42 @@ test('init', function() { equals( $('div', el).index( $('div.ui-tabs-hide', '#tabs1') ), 1, 'second panel should be hidden' ); }); +test('init with hash', function() { + expect(5); + + //set a hash in the url + location.hash = '#fragment-2'; + + //selection of tab with divs ordered differently than list + el = $('#tabs1').tabs(); + + equals(el.tabs('option', 'selected'), 1, 'second tab should be selected'); + + ok(!$('#tabs1 ul li:eq(0)').is('.ui-tabs-selected.ui-state-active'), 'first tab should not be selected nor active'); + ok($('#tabs1 div:eq(0)').is('.ui-tabs-hide'), 'first div for first tab should be hidden'); + + ok($('#tabs1 ul li:eq(1)').is('.ui-tabs-selected.ui-state-active'), 'second tab should be selected and active'); + ok(!$('#tabs1 div:eq(1)').is('.ui-tabs-hide'), 'second div for second tab should not be hidden'); +}); + +test('init mismatched order with hash', function() { + expect(5); + + //set a hash in the url + location.hash = '#tabs7-2'; + + //selection of tab with divs ordered differently than list + el = $('#tabs7').tabs(); + + equals(el.tabs('option', 'selected'), 1, 'second tab should be selected'); + + ok(!$('#tabs7-list li:eq(0)').is('.ui-tabs-selected.ui-state-active'), 'first tab should not be selected nor active'); + ok($('#tabs7 div:eq(1)').is('.ui-tabs-hide'), 'second div for first tab should be hidden'); + + ok($('#tabs7-list li:eq(1)').is('.ui-tabs-selected.ui-state-active'), 'second tab should be selected and active'); + ok(!$('#tabs7 div:eq(0)').is('.ui-tabs-hide'), 'first div for second tab should not be hidden'); +}); + test('destroy', function() { expect(6); diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js index 7f7a631ee49..ad99a99b782 100644 --- a/ui/jquery.ui.tabs.js +++ b/ui/jquery.ui.tabs.js @@ -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 ) { - this.panels.eq( o.selected ).removeClass( "ui-tabs-hide" ); + $( 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.panels[ o.selected ] ) ); + self._ui( self.anchors[ o.selected ], $( self._sanitizeSelector( self.anchors[ o.selected ].hash ) ) ) ); }); this.load( o.selected );