从检查值的 ajax 成功函数内部提交表单答案

【问题标题】：Submit a form from inside an ajax success function that checks the values从检查值的 ajax 成功函数内部提交表单
【发布时间】：2011-06-23 16:47:38
【问题描述】：

我已经看过大约 20 篇或更多关于该主题的帖子，但它们要么对我没有意义，要么略有不同。

这也是一个非常简单的场景。我有一个表单，当它提交时，我会进行 ajax 调用以查看电子邮件是否尚未被其他用户接收。如果不采取我想提交表格，如果是，请不要提交表格。

这是 HTML

<form id='greatForm' action='godothat.php' method='post'>
<input type='submit' id='email'>
<button>Send</button>
</form>

$('#greatForm').submit(function(){


        // GET THE VARS
        var email = $('#email').val();


         $.ajax({ 
            data: { 'field1' : email  },
            type: 'GET', 
            dataType: 'json',
            url: 'url.php',
            beforeSend : function(){   },
            success: function(answer){   
                if(answer.error === false){
                         // Submit this form without doing the ajax call again
                } 
                if(answer.error === true){
                    // Not ok, don't submit this form
                }
            }
        });                               

        return false;   
    });

感谢您的帮助。

** 更新 ** 可能我表述的不对。我的意思是如果“answer.error === false”为真，那么提交函数应该返回真。

所以在 AJAX 完成时，如果 answer.error 为 false，则提交应该为 true，反之亦然...

这样更有意义吗？

【问题讨论】：

如果没有另一个 ajax 调用，您将无法再次提交表单。你应该在服务器端处理这个。
@Dogbert -> 我添加了一个更新。基本上，如果 answer.data 为假，我希望提交返回真。我该怎么做才能得到它？

标签： jquery ajax forms

【解决方案1】：

$('#greatForm').submit(function(){
    if(!$(this).attr('validated'))
    {
     // GET THE VARS
     var email = $('#email').val();


      $.ajax({ 
        data: { 'field1' : email  },
        type: 'GET', 
        dataType: 'json',
        url: 'url.php',
        beforeSend : function(){   },
        success: function(answer){   
            if(answer.error === false){
                   $('#greatForm').attr('validated',true);
                   $('#greatForm').submit();
            } 
            if(answer.error === true){
                //display the errors
            }
        }
     });
     return false;  
    }                            
   return true;
});

这应该可以解决问题，您只需在表单中添加一个已验证的属性（如果它已经过验证）。并且只有在未预设属性时才验证表单，否则您提交。

【讨论】：

【解决方案2】：

在再次提交表单之前尝试删除“提交”事件处理程序：

if(answer.error === false){
    // Submit this form without doing the ajax call again
    $('#greatForm').unbind().submit();
}

【讨论】：

基本上 unbind() 然后 submit() 将重新发送数据。如果文件很大，则需要两倍的时间。

【解决方案3】：

从技术上讲，您只需返回 true 即可使其“提交”。浏览器将完成其正常的表单发送过程。但是，如果您想使用 AJAX 来执行此操作，则必须进行另一个 AJAX 调用以发送表单。每个请求都是它自己的实体。它不会为您保持连接打开。

不过，@Dogbert 是对的。一旦表单数据在那里处理，这种类型的事情应该在服务器端完成。如果您使用 AJAX 执行此操作，您仍然可以使用返回的响应来通知用户任何错误，但您应该期望他们在进行必要的更正后再次提交表单。

【讨论】：

> 这基本上就是我想要做的。如果 answer.data 为假，则返回真，反之亦然。我该怎么做？
我想这就是混乱所在。典型的流程是通过 AJAX 向服务器提交表单。服务器验证，如果它是好的，将其插入数据库或其他任何东西。然后，它将响应发送回客户端，指示发生了什么：成功或某些错误。如果是成功的话。您将新视图呈现给用户并收工。如果这是一个错误，您会通知用户并收工。然后，用户使用更正的数据发起全新的提交。
> 好的，所以没有解决方案可以根据结果返回 true。正确的？非常感谢您的帮助。
嗯？您确实根据结果返回 true 或 false，但您确定在服务器级别发送哪个，然后以 JSON 或 XML 格式将其作为响应发送。您的 javascript 的工作不是确定事情是否顺利进行，它获取服务器的方向并简单地做出相应的响应。

【解决方案4】：

如果我理解正确，您需要 php.url 中的 echo treu/false 示例：

$.ajax({

    type: 'POST',
    url: 'url.php',
    data: $("#your_form").serialize(),
    success: function(data) {
    if (data=='true') {                         
        ... 
    } else {

在 url.php 中

echo "true"; 
echo "false";

【讨论】：