Question

我在MVC项目中有一个奇怪的设置，我有jsonDisplayResult以下字段： -

地址第1行
地址第2行
镇
县
邮编

我们需要使用此地址转到Google地理编码，然后点击Ajax表单上的“提交”按钮获取经度和纬度。所以： -

@Ajax.BeginForm()

/ Location / CheckAddress /的结果按预期返回纬度和经度，但@using (Ajax.BeginForm("EditLocation", "Location", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "new-locations", OnBegin = "return OnBegin()", OnSuccess = "OnSuccess()", InsertionMode = InsertionMode.InsertBefore }, new { @id = "EditLocationForm" })) { @Html.AntiForgeryToken() @Html.ValidationSummary(false)  @Html.TextBoxFor(m => m.Latitude) @Html.TextBoxFor(m => m.Longitude) <input type="submit" class="btn btn--gradient btn--right" id="EditLocationSubmit" /> } function OnBegin() { $.ajax({ url: '/Location/CheckAddress/', datatype: "json", async: false, data: { addressLine1: $("#BrandLocationAddress_AddressLine1").val(), addressLine2: $("#BrandLocationAddress_AddressLine2").val(), town: $("#BrandLocationAddress_Town").val(), county: $("#BrandLocationAddress_County").val(), postcode: $("#BrandLocationAddress_Postcode").val(), }, type: "POST", success: function (data) { if (data !== "NORESULTS") { $("#Latitude").val(data.Latitude); $("#Longitude").val(data.Longitude); return true; } else { } }, error: function (response) { console.log(response); return false; } }); }在填充两个#Latitude和#Longitude字段之前进入表单提交。当我查看模型的Ajax.BeginForm()时，纬度和经度为0。

当我第二次发布时，字段是正确的纬度和经度值。我想这可能是因为[HttpPost]允许OnBegin()在执行Ajax.BeginForm子句的最后一行之前执行其操作，因此为0。

在我知道success子句的最后一行已经完成之前，有人可以建议第二种形式延迟提交吗？

Answer 1

您需要从函数返回false：

var allowSubmit = false;
function OnBegin() {
    if (allowSubmit == true) { return true; }
    $.ajax({
        // ... code
        success: function (data) {
            // ... code
            // here you need to submit the form using 
            $( "#EditLocationForm" ).submit()
            allowSubmit = true;
        },
        error: function (response) {
          // .. code
        }
    });

    return false;
}

在success中，按照上面的代码提交表单。

此外，请勿使用async: false执行此操作：您不希望在该操作进行时冻结UI。您可能要做的是禁用控件，以便用户无法更改它们，然后在success和error中重新启用它们。

使用MVC进行jQuery AJAX顺序调用

1 个答案: