jquery - Prevent tab content display in bootstrap 3? -



jquery - Prevent tab content display in bootstrap 3? -

i using bootstrap , bootbox plugin, , have code

here link plugin http://bootboxjs.com/#download

i showing nex tab info attribute, need when user click on sec display bootbox alert , prevent sec tab show if check button not check?

html

<div class="tab-content"> <div class="tab-pane fade in active" id="step-1"> <p>first</p> <p><input type="checkbox" name="user" value="user">i not robot</p> </div> <div class="tab-pane fade" id="step-2"> <p>second</p> </div> </div> <a class="pull-left" data-toggle="tab" href="#step-1">first</a> <a class="pull-right" data-toggle="tab" href="#step-2">second</a>

js

$("a").click(function() { bootbox.alert("please check!", function() { event.preventdefault(); }); });

here working fiddle http://jsfiddle.net/08997uok/1/

i have found event

$(document).on( 'shown.bs.tab', 'a[data-toggle="tab"]', function (e) { bootbox.alert("please check!", function() { event.preventdefault(); }); })

but problem how prevent?

here solution?

$('[data-toggle="tab"]').click(function(event) { if(!$('[name="user"]').is(':checked') && $(event.target).attr('data-toggle') == 'tab'){ event.preventdefault(); bootbox.alert("please check!", function() { }); homecoming false; } });

i'm not getting want, if want check whether checkbox checked @ time of selecting sec tab , if it's not checked don't want show sec tab content alert, can following.

$('[data-toggle="tab"]').click(function(event) { if(!$('[name="user"]').is(':checked') && $(event.target).attr('href') == '#step-2'){ event.preventdefault(); homecoming false; } bootbox.alert("hello world!", function() { }); });

jquery twitter-bootstrap-3 bootbox

Comments

Popular posts from this blog

xslt - DocBook 5 to PDF transform failing with error: "fo:flow" is missing child elements. Required content model: marker* -

mediawiki - How do I insert tables inside infoboxes on Wikia pages? -

Local Service User Logged into Windows -