使用ajax提交表单后使用php重定向到主页答案

【问题标题】：redirect to homepage using php after submiting form with ajax使用ajax提交表单后使用php重定向到主页
【发布时间】：2021-01-05 10:14:37
【问题描述】：

这是我第一次使用 ajax 和 php 。我有一个注册表单，在其中检查输入的用户名是否已存在于 mongodb 数据库中。如果确实如此，那么我会在我的页面中显示一个错误，否则我想重定向到我的 index.php 并开始一个会话。

编辑：我完全改变了我的脚本，现在我成功重定向了。 angularJS 警告消失了！

 $("#registerForm").submit((e)=>{
            e.preventDefault();
            var uname = $("#username").val();
            var fname = $("#firstname").val();
            var lname = $("#lastname").val();
            var addr = $("#address").val();
            var pw = $("#password").val();
            var sub = $("#submitRegister").val();
            var errorSubmit = $("#checkSubmitError").val();
            $.ajax({
              type:'POST',
              data:{username:uname,firstname:fname,
                    lastname:lname,address:addr, password:pw ,
                    submitRegister:sub , checkSubmitError: errorSubmit },
              url:'insertUser.php',
              success:(data)=>{
                if(data == 'success'){
                  window.location.href = '../php/index.php';
                }else if(data =='failed'){
                    $("#username").val(""); //empty username field
                    var submitErr = $("#checkSubmitError");
                    var isHidden =submitErr.hasClass("hide");
                    if(isHidden){
                      submitErr.removeClass("hide");
                      submitErr.addClass("show");
                    }else{
                      submitErr.removeClass("hide");
                      submitErr.addClass("show");
                    }
                }
              },
              error: (xhr)=>{
                alert("error");
              },

            });
          });



 <body>
       <form action = "insertUser.php" method= "POST" id ="registerForm" name= "regForm">
           ...my inputs with ids 
          <!-- button that submits form  -->
          <button type="submit" class="btn btn-success" id = "submitRegister" name="submit" 
           >Submit
          </button> 
        <!--hidden error I display if username exists --> 
        <span id ="checkSubmitError" class= "hide text-danger"> </span>
       </form>
  </body>

然后在我的 insertUser.php 中检查用户名是否存在于我的数据库中更新！

<?php

  require '../vendor/autoload.php';


  if(isset($_POST['submitRegister'])){
    $m = new MongoDB\Client("mongodb://127.0.0.1/");
    $db = $m ->ECommerce;
  
    $collection = $db->users;
    //check if username already exists 
    $alreadyExists = false;
    $check = $collection->find(array('userName'=>$_POST['username']));
    $count=0;
    if(is_array($check) || is_object($check)){
      foreach($check as $i){ 
        $count= $count+1;
      }
    }
    if($count==0){
   
      $document = array(
        "firstName" => $_POST['firstname'],
        "lastName" => $_POST['lastname'],
        "address" => $_POST['address'],
        "userName" => $_POST['username'],
        "password" => password_hash($_POST['password'] ,PASSWORD_DEFAULT)
      );
    
    
      $collection->insertOne($document); //inserts succesfully 
      $response = "success";
      echo $response;
      exit();
    
      
    }else{
      $alreadyExists = true;
      $response = "failed";
      echo $response;
      exit();
    }

  
  }
  

?>

【问题讨论】：

在header('Location:... 之后，您应该始终有一个exit;，因为header() 会向浏览器发送标头，它不会终止脚本的执行。不确定在这种情况下是什么导致了您的问题，但无论如何它应该存在
@RiggsFolly 没有工作仍然尝试多次加载 AngluarJS，我留在注册页面
据我所知，.load()-发出 GET 请求，而不是 POST 请求。这应该是一个 POST 请求，因此您可能需要重新考虑该方法并改用 $.ajax() 或 $.post()。
@vasilis 编辑后还有问题吗？如果没有，请发布回复解决方案并接受它作为好的解决方案。
@PedroFerreira 我可以在 2 天内完成

标签： php ajax forms

【解决方案1】：

我在示例中编辑的代码现在可以完美运行。结束了。我学到了什么：

$ajax 优于 $load 重定向方法。要将数据返回到 success() 函数，请在 php 脚本中使用 echo $data 然后 exit() 。

这些是这里的关键点。

【讨论】：