javascript - Button to Trigger Nav-Tab with Twitter Bootstrap -
this button triggers next tab load content, tab not switch, remains on first tab..
<br><a class="btn btn-primary" href="#tab2" data-toggle="tab">review</a><br>
here code nav nav-tabs:
<ul class="nav nav-tabs"> <li class="active"><a href="#tab1" data-toggle="tab">shipping</a></li> <li><a href="#tab2" data-toggle="tab">quantities</a></li> <li><a href="#tab3" data-toggle="tab">summary</a></li> </ul>
any solution for switching both tab&content appreciated
..perhaps way change button trigger next()
function in * bootstrap-tab.js v2.3.1:
, activate: function ( element, container, callback) { var $active = container.find('> .active') , transition = callback && $.support.transition && $active.hasclass('fade') function next() { $active .removeclass('active') .find('> .dropdown-menu > .active') .removeclass('active') element.addclass('active') if (transition) { element[0].offsetwidth // reflow transition element.addclass('in') } else { element.removeclass('fade') } if ( element.parent('.dropdown-menu') ) { element.closest('li.dropdown').addclass('active') } callback && callback() } transition ? $active.one($.support.transition.end, next) : next() $active.removeclass('in') } }
you assign review button click handler using jquery...
js:
$('#btnreview').click(function(){ $('.nav-tabs > .active').next('li').find('a').trigger('click'); });
html:
<a class="btn btn-primary" href="#" id="btnreview">review</a>
Comments
Post a Comment