Question

我有一个带有操作的表单，该表单带有带有方法post

的外部URL

<form name="myform" id="myform" action="externalurl.com" mehtod="post">
</form>

在页面底部，我的JavaScript标记为波纹管，并且在表单提交中，我有一个通过Ajax在控制器中对JsonResult进行的调用。

<script type='text/javascript'>

$('form#myform').submit(function () {
    var FirstName = $("#FirstName").val();
    var LastName = $("#LastName").val();

    $.ajax({
        type: "POST",
        url: "/umbraco/Surface/CheckoutMain/RegisterUser?FirstName=" + FirstName + "&LastName=" + LastName,
        dataType: "json",
        contentType: "application/json;charset=utf-8",
        success: function (response) {
            debugger
            if (response == "Yes") {
                return true;
            }
            else if (response == "RequiredFields") {
                alert("Please make sure all required fields are filled in.")
                return false;
            }
            else if (response == "No") {
                alert(response + "Please contact us!");
                return false;
            }
        }
    })
});
</script>

我只是不确定为什么要提交它，甚至还没有返回对ajax调用的响应。

我在做错什么吗？

这也是我控制器中的代码：

[HttpPost]
    public JsonResult RegisterUser(string FirstName, string LastName)
    {
        if (FirstName == "" || LastName == "" )
        {
            return Json("RequiredFields", JsonRequestBehavior.AllowGet);
        }
        else
        {
            return Json("Yes", JsonRequestBehavior.AllowGet);
        }
        return Json("No", JsonRequestBehavior.AllowGet);
    }

如果我返回No，它仍然会发布，并且如果在上面的代码中放置一个断点并逐步执行，我可以看到该站点已经重定向到了外部URL。（我希望这是有道理的。）

如果有人有任何建议，我将不胜感激。

Answer 1

您的$.ajax是异步的，因此success处理程序返回的任何内容都将被忽略；到那时，submit处理函数将已经完成（并且将返回undefined，而不是false）。

由于您不知道在回复返回之前是否可以提交表单，因此应return false 不管，然后，如果响应正常，请提交表单手动，否则不要提交表单（仅显示错误）：

$('#myform').submit(function() {
  var FirstName = $("#FirstName").val();
  var LastName = $("#LastName").val();
  $.ajax({
    type: "POST",
    url: "/umbraco/Surface/CheckoutMain/RegisterUser?FirstName=" + FirstName + "&LastName=" + LastName,
    dataType: "json",
    contentType: "application/json;charset=utf-8",
    success: (response) => {
      if (response == "Yes") {
        this.submit();
      } else if (response == "RequiredFields") {
        alert("Please make sure all required fields are filled in.")
      } else if (response == "No") {
        alert(response + "Please contact us!");
      }
    }
  });
  return false;
});

您可能还注意到，由于文档中的ID是唯一的（或应该），因此，只需使用ID选择器（'#myform'），就无需在其前面加上前缀form。

Answer 2

您的表单提交是因为HTML已经导致提交。

您可以使用event.preventDefault()来防止这种情况。

...
$('form#myform').submit(function (event) {
  event.preventDefault();
...

javascript提交表单，即使返回false

2 个答案: