使用Javascript+Ajax验证和提交表单

这就是我要做的

当在我的表单上单击“提交”表单时，javascript函数将在表单的所有字段中循环

对于每个字段，将调用一个函数，该函数将返回true/false，以指示是否正确填写了该字段

如果返回false，则在该字段旁边显示错误消息

如果所有字段都正确，则提交表单。如果没有，它不会提交

这是棘手的部分。虽然大部分验证都是通过javascript完成的，但用户名和电子邮件需要通过ajax进行验证，以查看用户名/电子邮件是否已经在使用中

我目前用于此ajax函数的结构类似于：

function validateSomething()
{
  var valid;
  $.post("something.php", {x:y},
  function(data)
  {
     if (isSomething(data))
       valid=true; 
       //Here referring to the valid variable 
       //set outside this function, in the
       // parent function
     else
       valid=false; 
  });
  return valid/
}

但这目前不起作用

我能做些什么使其工作，即我能阻止validateMething函数返回一个值，直到它被内部函数设置为true/false为止

你喜欢这项工作吗

function validateSomething()
{
  var valid="unset";
  $.post("something.php", {x:y},
  function(data)
  {
     if (isSomething(data))
       valid=true; 
       //Here referring to the valid variable 
       //set outside this function, in the
       // parent function
     else
       valid=false; 
  });
  //Loop without returning until valid is set to true or false
  while (valid=='unset')
  {
     //Do nothing?
  }
  return valid/
}

---

可以使用async:false强制ajax调用等待

使用jquery时如下所示：

function validateSomething() {
    var valid;
    $.ajax({
        url: "something.php",
        data: {x: y},
        type: "GET",
        async: false, // this makes the ajax-call blocking
        dataType: 'json',
        success: function (response) {
            valid= response.valid;
        }
     });
     return valid;
}

---

然而，使用AJAX的最大优势在于它是异步的。此同步调用可能会在浏览器等待服务器时锁定浏览器。

您可以使用async:false强制ajax调用等待

使用jquery时如下所示：

function validateSomething() {
    var valid;
    $.ajax({
        url: "something.php",
        data: {x: y},
        type: "GET",
        async: false, // this makes the ajax-call blocking
        dataType: 'json',
        success: function (response) {
            valid= response.valid;
        }
     });
     return valid;
}

---

然而，使用AJAX的最大优势在于它是异步的。此同步调用可能会在浏览器等待服务器时锁定浏览器。

您可能不想这样做。或者更恰当地说，去做，但在做的时候要小心

通过AJAX进行验证是时髦、流畅和令人敬畏的。但它不是验证服务器端的替代品。AJAx验证是服务器端验证，而不是服务器端验证。我可以将返回的函数设置为false，并将其转换为true，然后愉快地提交表单，即使您已检查以确保用户名不是“在服务器上”使用的。Javascript在客户端上运行，不可信任

当您实际提交表单时，必须在服务器上重新执行通过AJAX调用执行的任何验证

如果你这样做，那么是的，AJAX验证再次是时髦、流畅和令人敬畏的。所以去做吧。要使用javascript提交表单，例如在AJAX回调处理程序函数中，您可以说：

 if(formwasValid)
 {
      document.getElementById('idOfForm').submit();

      $('#idOfForm').submit(); //jQuery
 }
 else
 {
      alert('Invalid text');
 }

---

你可能不想。或者更恰当地说，去做，但在做的时候要小心

通过AJAX进行验证是时髦、流畅和令人敬畏的。但它不是验证服务器端的替代品。AJAx验证是服务器端验证，而不是服务器端验证。我可以将返回的函数设置为false，并将其转换为true，然后愉快地提交表单，即使您已检查以确保用户名不是“在服务器上”使用的。Javascript在客户端上运行，不可信任

当您实际提交表单时，必须在服务器上重新执行通过AJAX调用执行的任何验证

如果你这样做，那么是的，AJAX验证再次是时髦、流畅和令人敬畏的。所以去做吧。要使用javascript提交表单，例如在AJAX回调处理程序函数中，您可以说：

 if(formwasValid)
 {
      document.getElementById('idOfForm').submit();

      $('#idOfForm').submit(); //jQuery
 }
 else
 {
      alert('Invalid text');
 }

---

我停止了在客户端进行广泛的表单验证，因为无论如何代码都必须在服务器端复制

在客户端，我只是通过正则表达式对字段进行一些基本语法检查。这些检查将在用户开始键入时立即触发，但它们只是给出一个视觉通知，说明何时出现了错误红色边框、不同的背景颜色、字段旁边的红色“X”

---

我不阻止用户提交甚至无效的表单：然后，带有更详细检查的服务器端代码开始工作，这可以很容易地重新构造表单，以区分有效字段和无效字段，并生成关于检查失败原因的深入解释。

我停止在客户端执行大量表单验证，因为无论如何都必须在服务器端复制代码

在客户端，我只是通过正则表达式对字段进行一些基本语法检查。这些检查将在用户开始键入时立即触发，但它们只是给出一个视觉通知，说明何时出现了错误红色边框、不同的背景颜色、字段旁边的红色“X”

---

我不阻止用户提交甚至无效的表单：然后，带有更详细检查的服务器端代码开始工作，它可以轻松地重新构造表单，以区分有效字段和无效字段，并生成关于检查失败原因的深入解释。

啊，我不知道这个设置。.ajax函数将生成GET或POST POST吗？您可以使用类型指定它。更新答案以澄清。啊，我不知道那个设置。.ajax函数将生成GET或POST POST吗？您可以使用类型指定它。更新答案以澄清。是。首先使用XHR验证服务器端，然后重新验证服务器端，这似乎是非常荒谬的。服务器执行相同的操作两次。

---

为什么不在一个XHR中运行all-in-one XHR validate，process，XHR return true/false，Everyone happy.@Renzo:这取决于您是否希望表单在没有JS的情况下工作-我通常想要前者，这就是为什么我停止在JS中执行大量验证以避免重复代码的原因…是的。首先使用XHR验证服务器端，然后重新验证服务器端，这似乎是非常荒谬的。服务器执行相同的操作两次。为什么不在一个XHR中运行all-in-one XHR validate，process，XHR return true/false，Everyone happy.@Renzo:这取决于您是否希望表单在没有JS的情况下工作-我通常想要前者，这就是为什么我停止在JS中执行大量验证以避免重复代码的原因。。。