JQuery tab Ui not disabling -
i have tried alot no success. have 3 tabs. tab index 0,1,2
when page loaded 2rd tab index should disabled. when click on 1st tab index 3rd tab index should enable.
now on 3rd tab index , if go 0 tab index 2 tab index should disable.
so
0 index = disbale 2rd index
1 index = enable 2rd index
2 index = enable 0,1 index
thats want. below code not working when on tabs-1. not disabling index 2 :(
$('#paymenttabs').tabs({ select: function(e, ui) { var isvalid = true; var num = 0; if (ui.panel.id == "tabs-1"){ $('#paymenttabs').tabs("disable",[2]); }else if (ui.panel.id == "tabs-2"){ $('#paymenttabs').tabs( "enable" , 2 ) }else if (ui.panel.id == "tabs-3"){ $('#paymenttabs').tabs("option","disabled",[]); } } });
i think reason occurring because according documentation:
the selected tab cannot disabled.
so when go [tab3]
[tab1]
, attempting disable [tab3]
, on. around setting timer small amount of time , executing tab switching code after timer has completed. ensure active tab not 1 you're trying disable:
$('#paymenttabs').tabs({ select: function(e, ui) { settimeout(function() { var isvalid = true; var num = 0; if (ui.panel.id == "tabs-1") { $('#paymenttabs').tabs("disable", 2); } else if (ui.panel.id == "tabs-2") { $('#paymenttabs').tabs("enable", 2) } else if (ui.panel.id == "tabs-3") { $('#paymenttabs').tabs("option", "disabled", []); } }, 10); } });
here's working example: http://jsfiddle.net/csq6x/
Comments
Post a Comment