3

I'm using jQuery tabs to create a tab bar with four tabs. After the tabs are initialized, when a certain link is clicked, I want to disable the first tab and select the second tab.

I can successfully disable the second tab and select the first like this (inside my click function):

$("#settings-tabs").tabs("option", {
    "disabled": [0, 1],
    "selected": 0
});

But how do I disable the first tab and select the second? Well, selecting the second tab is easy: "selected": 1. But I can't figure out how to disable the first tab. I've tried:

"disabled": [0, 0]
"disabled": [0]
"disabled": 0
"disabled": [-1, 0]

In all cases, the second tab will be selected by default, but then I can still click on the first tab to switch back to it.

What am I missing?

daGUY
  • 27,055
  • 29
  • 75
  • 119

1 Answers1

2

Try calling select prior to calling diabled: jsFiddle example

$("#tabs").tabs();
$("#tabs").tabs("option", {
    "selected": 1,
    "disabled": [0]
});​

or

$("#tabs").tabs();
$( "#tabs" ).tabs( "option", "selected", 1 );
$( "#tabs" ).tabs( "option", "disabled", [0] );​
j08691
  • 204,283
  • 31
  • 260
  • 272
  • Neither way works - in both cases, it selects the second tab, but the first remains enabled. – daGUY Jul 20 '12 at 20:09
  • Can you post an example on jsFiddle or post the pared down code that gives you the problem? As you can see from the example in my answer it should be possible. – j08691 Jul 20 '12 at 20:11
  • Do you have other JavaScript that may be conflicting? – j08691 Jul 20 '12 at 20:36
  • Ah - it's because of the fade effects I'm using. Updated fiddle: http://jsfiddle.net/xJ9vX/1/ Note the `fx` option. That seems like a bug. Any way around it? – daGUY Jul 20 '12 at 20:40
  • Also, something weird: it only happens if you click the link to disable the first tab *with the first tab selected.* If you click a different tab first, then click the link, the first tab will disable correctly. – daGUY Jul 20 '12 at 20:41