Bootstrap 3: How to close popup using jQuery?

There are two popups in my code. first for login and second for password reset. A link to the second popup is located in the login popup. I want to automatically close the login window when I click the forgot password link.

<a href="#" data-toggle="modal" data-target=".loginform">Login</a>
<!- Login Popup start-->

<div id="login" class="modal fade loginform" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    ....
    <label>
        <input type="checkbox"><span style="font-size:12px;display:block;">Remember me</span>
    </label>
</div>
</div>
</div>


</div>
<div class="modal-footer">
    <a data-toggle="modal" data-target=".forgotpassword" href="#" style="float:left;font-size:14px;">Forgot Password</a>
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Login</button>
</div>
</div>
<!-- /.modal-content -->
</div>
</div>


<!- popuplogin end-->
<!- Popup forgot password start-->

<div id="forgot" class="modal fade forgotpassword" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    .......
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Reset</button>
    </div>
</div>
<!-- /.modal-content -->
</div>
</div>


<!- popup end-->

Jsfiddle demo

+3
source share
2 answers

save the identifier for the password link for the password and click $('#login').modal('hide');

$("#forgotPass").click(function(){
       $('#login').modal('hide');
});

Fiddle

+9
source

In this documentation: http://getbootstrap.com/javascript/#modals

Shown: $('#myModal').modal('show');

Hiding: $('#myModal').modal('hide');

+7
source

All Articles