Question

我有代码验证表单内的输入，如果满足条件，则会在div class="error"中显示错误消息。但是，在使用AJAX阻止页面重新加载时，PHP验证不再显示消息，但仍在后台运行。有人为什么会这样吗？如何让PHP验证再次工作？谢谢你的帮助。

正如您所见，验证错误应显示在$email_error

中

<form class="form_pro" action="index.php" method="post" role="form">

<input type="text" class="form" name="E-mail" placeholder="E-mail" value="<?= $email ?>">

<div class="error"><?= $email_error ?></div>

<button name="submit" type="submit" class="action_button"></button>

</form>

PHP

此处的错误消息在添加AJAX代码之前显示在“div”内

if ($_SERVER["REQUEST_METHOD"] == "POST") {

 if (empty($_POST["E-mail"])) {
    $email_error = "E-mail is required";
  } else {
    $email = test_input($_POST["E-mail"]);

    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
      $email_error = "Invalid email format"; 
    }
  }
}

的jQuery

添加此内容以防止在提交时重新加载页面，PHP错误消息不再显示

$( document ).ready(function() {
    $(".form_pro").submit(function(e) {
        e.preventDefault();

        $.ajax({
            type: "POST",
            url: "php/interuni_process.php",
            data: $(this).serialize(), 
            success: function(data) {

            },
            error: function() {

            }
        });

    });
});

Answer 1

简单的PHP错误：

<div class="error"><?= $email_error ?></div>

当您只是提交表单时，根据您的条件验证失败，然后设置$email_error，当页面加载时，服务器会解释错误并打印出来。

当您通过AJAX提交时

它检查错误验证以及是否设置了失败$ email_error但是未解释未重新加载的页面。所以当你需要通过ajax提交而不是设置错误回应它时它会正常工作

Answer 2

您需要修改PHP以返回带有成功响应或错误详细信息的响应，然后在您需要解析响应的Javascript“success”函数内部，如果是错误响应，则需要相应地更新DOM。

Answer 3

1）您需要在服务器端回显错误消息并从服务器获取响应并将其附加到该div

HTML： 的 htm_page.php

<form class="form_pro" action="index.php" method="post" role="form"> <input type="text" class="form" name="E-mail" placeholder="E-mail" value="<?= $email ?>"> <div class="error"></div> <button name="submit" type="submit" class="action_button"></button> </form>

PHP：destination.php

if ($_SERVER["REQUEST_METHOD"] == "POST") { $email_error=''; if (empty($_POST["E-mail"])) { $email_error = "E-mail is required"; } else { $email = test_input($_POST["E-mail"]); if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { $email_error = "Invalid email format"; } } echo $email_error; }

AJAX：html_page.php

$( document ).ready(function() { $(".form_pro").submit(function(e) { e.preventDefault(); $.ajax({ type: "POST", url: "destination.php", data: $(this).serialize(), success: function(data) { if(data.trim() !='') { $('.error').html('<h1>'+data+'</h1>'); } }, error: function() { } }); }); });

Answer 4

简单的Ajax不能与PHP验证一起使用，因为Ajax错误部分意味着ajax端失败而不是PHP验证！因此，如果PHP验证失败，它将不会转到错误部分，如何仍然可以使提交返回false并在成功部分中在JS＆amp; Ajax中执行类似的操作：

    success: function(data) {
        if(data.error)
        {
            alert(data.error);
            return false;
        }

Answer 5

由于您已阻止页面加载，因此无法看到在服务器上呈现的错误以及在前端显示的错误。

要实现此目的，您需要编辑您的jquery代码

$( document ).ready(function() {
    $(".form_pro").submit(function(e) {
        e.preventDefault();

        $.ajax({
            type: "POST",
            url: "php/interuni_process.php",
            data: $(this).serialize(), 
            success: function(data) {

            },
            error: function(data, errorThrown)
            {
               $('.error').html(errorThrown);
            }
        });

    });
});

实现AJAX后，PHP验证无法正常工作

PHP

的jQuery

5 个答案: