如何从ajax回调中控制表单提交？

Question

我最初在我的ajax回调中有return true/false，并且意识到它可能不在正确的上下文中被调用，所以我重写了我的函数，如下所示，但它仍然不起作用。提交变量是否没有从回调函数中传递？确认（if .btn-danger）工作，但不只是如果你打提交并且不需要确认）

$('#form').submit(function(e){ 
    var submit = false; 
    if($('.btn-danger').length){ 
     submit = true; 
    } else { 
     $.ajax({ 
      url: base_path+"ajax/myajaxfile", 
      type: "post", 
      data: { 
       data1 : $("#amount").val(), 
       data2 : $("option:selected").val() 
      }, 
      dataType: "json", 
      success: function(data) { 
       if (data.needconfirmation === 'true'){ 
         $('#edit-submit').val("Confirm"); 
         $('#edit-submit').removeClass("btn-primary"); 
         $('#edit-submit').addClass("btn-danger"); 
         $('#payment-form').after('<span class="warning"> Do you really wanna?</span>'); 
       } else { 
        submit = true; 
       } 
      }, 
      error: function(data) { 
       alert("an error has occurred"); 
      } 
     }); 
    } 
    if (submit){ 
     return true; 
    } else { 
     return false; 
    } 
}); 

Answer 1

我觉得你的问题是，AJAX调用都是异步的 - 所以函数的返回值是在成功函数被调用之前进行评估，因此提交变量仍然是错误的。

你需要要么使AJAX调用同步：

async: false 

或可能会更好。将重组它。

Answer 2

$.ajax是异步的，所以在成功回调发生之前，其余的代码会继续执行，因此它的设置submit = true不会影响函数末尾的检查。

确认（如果.btn-危险）工作，只是如果你打不提交并且不需要

确认你怎么知道是否需要或不确认？您可能需要为您检查的地方添加支票.btn-danger。

此外，您还可以通过只是在做

return submit; 

Answer 3

一个做AJAX首次的最令人困惑的方面是异步的部分清理你的代码的最后一位。与普通的JavaScript（当然，正常的jQuery至少），你处理一个提交像这样：

$('#form').submit(function(e){ 
    var submit = /*Figure out if it was a success or not*/; 
    if (submit){ 
     return true; 
    } else { 
     return false; 
    } 
}); 

某个事件触发提交，你弄清楚它是否是有效的，那么你要么继续或你不”吨。

通过AJAX提交虽然“找出是否成功”的步骤发生在正常流程之外。这意味着你想要做的就是总是返回false;你不知道是否继续，所以不要继续。你的AJAX回调函数（你的AJAX调用的选项中的“success：”函数）是否是“数字输出”代码，并且你的目前正确的想法是“success = true”......除非它解决的时候，你原来的提交函数已经结束了（你将会返回false）。

因此，您需要做的是修改您的成功处理程序以执行......通常会在您提交时发生的任何事情。这可能与隐藏表单的form.submit（）一样简单，也可能更复杂;我不知道你的应用程序。希望这会给你基本的想法。