Модель представления ASP.NET Core при отключении полей формы с помощью jQuery.validate

Question

У меня есть HTML-форма, и мне бы хотелось, чтобы, когда пользователь нажимает кнопку «Отправить», кнопка и все элементы ввода (в основном текстовые поля) в форме отключаются, чтобы они не могли изменять какие-либо данные или нажимать кнопка во второй раз. Я использую jQuery.validate в форме без ненавязчивого плагина.

Разметка для формы выглядит следующим образом (несущественная разметка удалена для ясности) ...

<form method="post" asp-controller="Home" asp-action="Jim">
  <div class="form-group row">
    <label for="Name">Your name</label>
    <input type="text" id="UserName" name="UserName">
  </div>

  <div class="form-group row">
    <label for="Email">Email</label>
    <input type="text" id="Email" name="Email">
  </div>

  <div class="form-group row">
    <div>
      <button type="submit">Submit</button>
    </div>
  </div>
</form>

У меня есть следующий JavaScript, который использует jQuery.validate ...

$("form").validate({
  rules: {
    UserName: {
      required: true,
      minlength: 3
    },
    Email: {
      required: true
    },
    Message: {
      required: true
    }
  },
  submitHandler: function(form) {
    form.submit();
  }
});

Это все, что JavaScript на странице.

Это отлично работает. Однако, если я добавлю одну строку в функцию submitHandler ...

  submitHandler: function(form) {
    $("form input").prop('disabled', true);
    form.submit();
  }

... затем, когда форма отправлена, Request.Form пуст, поэтому никакие мои данные не отправляются на сервер.

Кажется, это связано с jQuery.validate, как будто я полностью заменяю JavaScript на это ...

$(function() {
  $("form").submit(function(form) {
    $("form input").prop('disabled', true);
  });
});

... тогда элементы управления отключены, и мои данные поступают нормально. Кажется, это означает, что я делаю что-то не так с jQuery.validate.

Любой, кто сможет объяснить, почему мои данные не передаются, когда я отключаю элементы управления при использовании jQuery.validate?

Answer 1

Причина в том, что отключенные входы не отправляются с формой. См. здесь и здесь .

Вы должны использовать атрибут readonly вместо disabled. Поля только для чтения не могут быть отредактированы пользователем, но все еще отправляются с формой.

submitHandler: function (form) {
    $("form input").prop('readonly', true);
    form.submit();
}