javascript - 出现问题时在模态窗口中显示错误

Question

我需要一些帮助。当我的模态窗口出现问题时，我需要显示错误。现在，只是关闭，还有错误的时候。我试图找到一些 Ajax 和 Javascript 来解决这个问题，但我无法让它正常工作。有人可以帮助我并感谢您的帮助吗？

if($result->num_rows == 0) {
                    $this->errors[] = "User not fund";
                }else{

模态窗口

<!-- Modal -->    
<div class="modal fade" id="resetPassword" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div style="background-color:#3a3a38;" class="modal-content">
    <div class="modal-header">
      <h4 style="color:#fff" class="modal-title">Nulstill adgangskode</h4>
    </div>
    <div class="modal-body">
      <form role="form" action="index.php" method="post">
                                <div class="form-group">
                                    <label class="sr-only" 
for="email_forgot">Email</label>
                                    <input type="text" name="email_forgot" 
placeholder="email..." class="form-username form-control" id="form-username">
                                </div>
                                 <input style="margin-left:auto;margin-
right:auto;" data-backdrop="static" data-keyboard="false" class="btn-lg btn-
default btn-block" type="submit" value="send" name="forgot">
                            </form>
<?php                                              

if (isset($user)) {
if ($user->errors) {
    foreach ($user->errors as $error) {
        echo  '<a style="color:red">'.$error.'</a>';
    }
}
if ($user->messages) {
    foreach ($user->messages as $message) {
        echo '<span style="color:red">'. $message.'</span>';
    }
}
}
?>
    </div>

  </div>

</div>

Answer 1

使用 ajax 提交表单并使用 javascript 而不是 php 显示错误。现在您的页面重新加载并且您丢失了数据。

<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>



$('form').on('submit', function(event){
  event.preventDefault();
  var formData = $("form").serializeArray();

  $.ajax({
    url: "index.php",
    type: "POST",
    data: formData,
    dataType: 'json',
    success:function(data){
      $('body').html('<h1>Thank You</h1>');   
    },
    error:function(){
      $('body').html('<h1>Error</h1>');   
    }  
  });
});