Javascript отправляет форму, даже если вернуть false

Question

У меня есть форма с действием с внешним URL-адресом с методом post

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

Внизу страницы у меня есть теги javascript, показанные ниже, и отправка формы в форме У меня есть вызов, которыйделается в JsonResult через Ajax в контроллере.

<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

Ваша форма отправляется, потому что HTML уже вызывает отправку.

Вы можете использовать event.preventDefault () , чтобы предотвратить это.

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

Answer 2

Ваш $.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;
});

Вы также можете заметить, что, поскольку идентификаторы в документе (или должны быть ) уникальными, не стесняйтесь просто использовать селектор идентификаторов ('#myform'), нет необходимости префиксировать его с form а также.