如何在按下按钮时禁用模态关闭

Question

I'm trying to create a login form in modal window. The problem is when I click on the sign in button, and if the login credentials are wrong, the modal closes. User needs to click again on the sign in button to see the modal and the error message.

How can I solve this?

This is the modal content.

<div id="signin" class="modal fade">
  <div class="modal-dialog">
                <?php include "view/login.html";  ?>
   </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

login.html file.

<section class="frontoffice" style="padding: 20px 0;">
    <div class="">
        <h3 class="text-center" style="font-weight:700">SIGN IN</h3>
        <div class="row">
        <form action="" method="POST">
            <div class="col-md-1">
            </div>
            <div class="col-md-10 request-form">
                <div class="form-area">
                    <div class="row">
                        <div class="col-md-12">
                            <input class="text-field" name="username" type="text" placeholder="Username*" style="width:100%">
                            <?php echo $unameerror; ?>
                            <input class="text-field" name="password" type="password" placeholder="Password*" style="width:100%">
                            <?php echo $passerror; ?>

                        </div>
                    </div>
                </div>
                <div class="row" style="margin:20px;">
                    <div class="col-md-12 text-center">
                        <input type="submit" value="SIGN IN" name="login" class="blueButton">
                    </div>
                </div>
            </div>
        <div class="col-md-1">
        </div>
        </form>
        </div>
    </div>
</section>

Javascript

<script type="text/javascript">
$(document).ready(function() {
    $("[rel='popup']").popover();
});

Answer 1

The <input type='submit'/> automatically posts a form, once pressed. So the page should be refreshed after button press. You should use ajax to send the form and post back the response. It should look like this:

$(function(){

 $("form").on("submit", function(e){
  e.preventDefault();
  $.post("url", $(this).serialize(), function(response){
    //present errors
  }, "json");
  })
})

---

On the php side, set the response as an array, and use echo json_encode($array) to present the result.

Hope i got it this time :D