search

VinceG / twitter-bootstrap-wizard

This twitter bootstrap plugin builds a wizard out of a formatter tabbable structure. It allows to build a wizard functionality using buttons to go through the different wizard steps and using events allows to hook into each step individually.
MIT License
1.39k stars 676 forks source link

onTabShow event fires twice #117

Open mikheil09 opened 9 years ago

mikheil09 commented 9 years ago

When I call bootstrap wizard and try handle 'onTabShow' event, it fires two time

my code is: var wizardEl = $('#rootwizard'); wizardEl.bootstrapWizard({ onTabShow: function (tab, navigation, index) { var $total = navigation.find('li').length; var $current = index + 1; var $percent = ($current / $total) * 100; wizardEl.find('.progress-bar').css({ width: $percent + '%' }); lastPageIndex = $total; loadWizardCurrentStepContent(tab, $current); }, onNext: wizardOnNext, onTabClick: function (tab, navigation, index) { return true; } });

loriolson commented 8 years ago

+1 having the same issue.

nask0 commented 7 years ago

+1 @stefann42 commit fixes the issue.

a3aakash commented 7 years ago

Please can anyone tell me the solution for this issue? I am facing the same in my project. Urgent.

nask0 commented 7 years ago

@a3aakash just read the whole issue, solution is here : https://github.com/AreYouFreeBusy/twitter-bootstrap-wizard/commit/98e392746a14645ed4ff3ada31cd923e864273c6 - i already tested it and it works. However, i just make small tunes on @stefann42 code.

a3aakash commented 7 years ago

thank you @nask0.. I think this is not being released on the master branch thats why my code was not updated. Thanks again.. :)

a3aakash commented 7 years ago

This issue hasnt been uploaded on the master branch till yet. so please do this so that it wont create any issue further.

VinceG commented 7 years ago

@mikheil09 @nask0 @a3aakash can you submit a pull request?

sebastianvirlan commented 6 years ago

This is not an issue. This behaviour happens when you don't have any default active class on any of the tab's li.

When the library is initialised fixNavigationButtons from line 31 is called. But because you don't have an active tab the 275 line event is triggered which again trigger fixNavigationButtons

275: $('a[data-toggle="tab"]', $navigation).on('show show.bs.tab', innerTabShown);

As https://getbootstrap.com/docs/3.3/components/#nav-tabs tabs documentation example is:

<ul class="nav nav-pills">
  <li role="presentation" class="active"><a href="#">Home</a></li>
  <li role="presentation"><a href="#">Profile</a></li>
  <li role="presentation"><a href="#">Messages</a></li>
</ul>

there is a default tab.