CODEWITHSUNDEEP
twitter-bootstrap-3
Asif Asghar
Asif Asghar

Reputation: 906

Keep Bootstrap Modal Open when page refresh

I'm using the Twitter Bootstrap modal as a login window, and would like it remains open if user put wrong login info. My Page refreshed after submitting the form.Is there a way after refresh page modal open again and I an show the message there that Login Failed:Please try again.

Upvotes: 1

Views: 6234

Answers (2)

Ship B
Ship B

Reputation: 101

You will have to trigger the modal when there is an error after a post back.

You could have the server print out some javascript to trigger the modal after a post back ONLY on an error condition. You didn't mention what server side technology you are using, so here is some psuedo server side code:

if (hasAuthenticationErrors) 
     <script type="text/javascript">
         $('#myModal').modal('show');
     </script>
end if

That bit of javascript would have to be rendered AFTER the modal is initialized with a show:false option

$('#myModal').modal({ show: false})

see: How can I trigger a Bootstrap modal programmatically?

Upvotes: 1

Yorick de Wid
Yorick de Wid

Reputation: 929

The scenario is certainly possible, but not even necessary. You should use the preventDefault in order to withhold the form from submitting the page. That is, if you use AJAX, which looks to be the perfect place for it.

An example would be

$(function () {
    var frm = $('#form');
    frm.submit(function (ev) {
        $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
            alert('ok');
            }
        });
    ev.preventDefault();
    });
});

Upvotes: 0

Related Questions