Jquery通过ajax调用外部PHP文件来验证表单，该文件检查所有字段，并在出现错误消息时阻止表单提交

jquery validate form with ajax call to external php file that checks all fields and block form submit if there is error message

本文关键字：文件 表单提交 字段 错误 消息 检查 外部 调用 ajax 通过 PHP      更新时间：2023-09-26

我想在提交事件上验证表单字段。我正在发送ajax请求到php文件，检查字段并返回错误消息或什么都没有，如果一切正常。这是我的js代码:

$('form.p_form').submit(function (){
var description = $.trim($('#f9').val());
//this blocks form submit if empty field and it works
if(description === '') return false;
//this doesnt work
if(description !== ''){
var aa = $.post("checkdescription.php",{
     description: description
 },
 function(data, status){
    if(data !== ''){
    return data;
    }
 });
 //here I need to know the response text returned from ajax so I can say like this:
 if(aa === 'error message'){
 return false;
    }
 }
});

请帮助，我是堆叠和我张贴这个问题第二次，因为我不能得到帮助，提前感谢!

您的变量aa将不包含您期望的任何数据(实际上它可能包含调用AJAX的post方法返回的承诺)。

此外，您正在使用post方法的ajax调用的默认同步类型。

为了访问返回的数据(甚至在承诺之外)，您可以使用$.ajax和async: false属性:

 var aa = ''; //the result
 $.ajax({
     url: "checkdescription.php",
     async: false,
     data: {
     description: description
     }, 
     success: function(data, status){
         aa = data;
      }
});

然后，您可以在ajax调用后不久检查变量aa的值。

 if(aa === 'error message'){
     return false;
 }

脚本应该在post请求的'data'变量中捕获响应。例如，成功时为空或错误时为"错误信息"。请在下面尝试并检查是否适合您。

var aa = $.post("checkdescription.php",{
 description: description
 },
 function(data, status){
  // data will be empty is everything is ok and "error message" if there is validation error
   if(data == 'error message'){
       // handle error
   } else {
      // on success it should be here
   }
 });

您正在尝试将响应与异步get调用进行同步比较。在ajax调用完成之前，回调函数不会设置var aa的值。当你试图比较同步和异步时，你必须记住这一点。

那么让我们一步一步地看看这里的代码会发生什么:

  1. 表单提交
  2. [推定]描述不是空白
  3. var aa = undefined
    4. Ajax post被调用到checkdescription.php
  4. aa不等于"error message"

aa永远不会等于'error message'，并且到达提交函数的末尾(因为完成的ajax响应还没有设置aa的值)

  • (这可能永远不会在这段代码中，但让我们假装它可以)ajax调用返回一个响应，然后您的回调函数将被实例化，它将返回数据或false。现在var aa有了一个值。
    •
    相关文章：