Returning False for onTab(Show|Change|Click) Does Not Cancel about twitter-bootstrap-wizard HOT 20 CLOSED

@digEmAll http://jsfiddle.net/157ttz1p/4/

Here you go, basically I wired every tabchange method to a validator function and pass in the current wizard tab. If the validation for that tab hasn't been met, then navigation is prevented. Hope this helps.

from twitter-bootstrap-wizard.

Wizard with disabled tab click not working?

http://vadimg.com/twitter-bootstrap-wizard-example/examples/basic-disabletabshow.html

any clue how to fix this?

from twitter-bootstrap-wizard.

@esheri3 I'll look into it and will let you know.

Thanks.

from twitter-bootstrap-wizard.

@esheri3 This is confirmed. i'll have to come up with a solution since the onTabShow is triggered when the tab is already shown. I think of updating the readme to state that onTabShow returning false will not prevent tab from showing and just fixing the onTabChange.

from twitter-bootstrap-wizard.

Playing with the latest ZIP as of writing it appears that the index parameter value in onTabChange() is always -1. Any chance we can get this bug fixed? Makes it very hard to use this component if you need to do validation before a user changes a tab.

Another idea would be to add an event OnTabChanging() which fires before the tab changes, that way none of the existing code has to change. Returning false there could prevent the change.

from twitter-bootstrap-wizard.

@natiki This is still WIP as the tab changing returning false does not prevent the fire of the method. So there needs to be a different solution. You can use the onNext even to do the same thing. and i am not sure what you meant with the last event addition

from twitter-bootstrap-wizard.

@VinceG Thanks for the feedback. What I meant was adding a new event called OnTabChanging which fires before the tab has changed as opposed to OnTabChanged which fires after the tab has changed.

If you add this to the life cycle then should a user want to prevent a tab being changed they return false there. Means you can leave the current behaviour (ie not have to do work out how to change back to the original tab when you are on the new tab already in OnTabShow etc.)

from twitter-bootstrap-wizard.

@VinceG what you think about pull request #69 ?

from twitter-bootstrap-wizard.

@ruionwriting Sorry, haven't tested this yet. i'll try to do it this weekend.

from twitter-bootstrap-wizard.

Are there any plans on fixing this? I would love to keep using this with my project, and I would love to help fix it as well, but it's beyond my abilities.

#69 doesn't seem to work for me either.

from twitter-bootstrap-wizard.

@accomazzo did you test #69 and it didn't work for you either?

from twitter-bootstrap-wizard.

Yes that's correct, I even tried using bootstrap 3.0, I am using 3.1.

from twitter-bootstrap-wizard.

'return false' does not work. On first tab get -1 index, then afrer clicking tab index gets cached, and on every first click on tab it has old index, on next clicks index is ok, but too late, so event if 'return false' would work, no glory.

Header navbar links are hard to disable, almost uncovered subject in the library.

from twitter-bootstrap-wizard.

Just in case anybody else runs into this like I did.

Using a combination of onTabClick and onNext I was able to prevent navigating based on validation

from twitter-bootstrap-wizard.

@David-Melo : could please create a jsfiddle example ?
You can modify this if you like: http://jsfiddle.net/157ttz1p/2/

from twitter-bootstrap-wizard.

@David-Melo thanks a lot :)

from twitter-bootstrap-wizard.

Using the latest code, returning false for onTabClick doesn't work:
onTabClick: function(tab, navigation, index) {
return false;
}
It doesn't seem possible to disable tab clicks, which is a problem.

from twitter-bootstrap-wizard.

onTabClick: function(tab, navigation, index) {
return false;
}
Is working for me!
Only issue I have with onTabClick function is, that my "prev" & "next" button´s CSS is for some reason changed.

from twitter-bootstrap-wizard.

@gayanc can you try this:

http://vinceg.github.io/twitter-bootstrap-wizard/examples/basic-disabletabclick.html

from twitter-bootstrap-wizard.

After an hour of struggle removing data-toggle=tab from the nav actually worked

from twitter-bootstrap-wizard.