如果ajax验证器使用jquery返回true，则提交表单 [英] Submit form if ajax validator returns true using jquery

问题描述

我不确定我要出错的地方。这个想法是，在提交表单之前，其中一个输入字段通过ajax发送到服务器端验证器。如果回复为1，则输入有效，并提交表单。如果回复为0，则不应提交表单。问题是我无法弄清楚如何在ajax请求函数中设置一个变量来防止表单被提交。这是我的：

  $（＃form）。submit（function（）{
 var valid = false; 
 var input = $（＃input）。val（）; 
 $ .ajax（{
 type：POST，
 url：validator。 php，
 data：input =+ input，
 success：function（msg）{
 valid =（msg == 1）？true：false; 
 if ！valid）{
 $（＃valid_input）。html（请输入有效信息）; 
} else {
 $（＃valid_input）。html（） ; 
} 
} 
}）; 
 return valid; 
}）; 
  

解决方案

问题在于 $ .ajax 请求是异步的，需要一段时间才能完成。因此，该函数在成功函数执行事件之前进行并返回false。

为了解决这个问题，您可以添加 async：false 给你设置为AJAX调用，但是这会暂停执行，直到AJAX调用返回。

另一种解决方案是创建一个隐藏的输入， 有效：

 < input type =hiddenname =有效值=假/> 
  

然后在submit函数中但在ajax调用之前创建对 var $ form = $（this）。然后，如果AJAX调用返回有效更改此隐藏输入的值，并再次提交表单：

  $（'input [名称= 有效] '）VAL（' 真）; 
 $ form.submit（）; 
  

然后在提交函数结束时仅当隐藏输入的值为true时才返回false ：

  if（$（'input [name =valid]'）。val（）=='false'） {
 $ .ajax（{...}）; //将隐藏输入的值从false更改为true 
返回false; 
} 
  

I am not sure where I'm going wrong. The idea is that before the form is submitted, one of the input fields is sent to a server-side validator via ajax. If the response is 1, the input is valid and the form should be submitted. If the response is 0, the form should not be submitted. The issue is that I can't figure out how to set a variable within the ajax request function that will prevent the form from being submitted. This is what I have:

$("#form").submit(function() {
    var valid= false;
    var input = $("#input").val();
    $.ajax({
       type: "POST",
       url: "validator.php",
       data: "input=" + input,
       success: function(msg){
            valid = (msg == 1) ? true : false;
            if(!valid) {
                $("#valid_input").html("Please enter valid info");
            } else {
                $("#valid_input").html("");
            }
       }
     });
    return valid;
 });

解决方案

The problem is that the $.ajax request is asynchronous and takes a while to complete. Therefore the function carries on and returns false before the success function is event executed.

To solve this you could add async: false to you settings for the AJAX call, but this would suspend execution until the AJAX call returns.

Another solution would be to create a hidden input in the form called valid:

<input type="hidden" name="valid" value="false" />

Then within the submit function but before the ajax call create a reference to the from var $form = $(this). Then if the AJAX call returns valid change the value of this hidden input, and submit the form again:

$('input[name="valid"]').val('true');
$form.submit();

And then at the end of the submit function only return false if the value of the hidden input is true:

if ($('input[name="valid"]').val() == 'false') {
    $.ajax({ ... }); // changes the value of the hidden input from false to true
    return false;
}

这篇关于如果ajax验证器使用jquery返回true，则提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！