ASP.NET MVC4 - проверка скрытого поля не очищается после установки значения

У меня есть скрытое поле в моей форме, которое требуется. Скрытое поле заполняется, когда пользователь выбирает значение из текстового поля с помощью автозаполнения пользовательского интерфейса jQuery. Я настроил свой валидатор форм, чтобы не игнорировать скрытые поля, чтобы валидация действительно работала. Проверка действительно работает, но когда пользователь выбирает нужный параметр из автозаполнения, которое затем заполняет скрытое поле, сообщение проверки не будет очищено и будет отображаться до тех пор, пока форма не будет опубликована. Нужно ли вручную звонить $('form').validate() или что-то, когда скрытое поле будет установлено, или есть способ сделать это без какого-либо дополнительного кода JavaScript?

Моя модель просмотра:

public class IndexViewModel
{
    public string SchoolName { get; set; }
    [Required]
    public int SchoolId { get; set; }
}

Мой взгляд:

@model IndexViewModel

@using (Html.BeginForm())
{
    <p>
        @Html.LabelFor(m => m.SchoolName)
        @Html.TextBoxFor(m => m.SchoolName)
        @Html.HiddenFor(m => m.SchoolId)
        @Html.ValidationMessageFor(m => m.SchoolId)
    </p>

    <p>
        <input type="submit" />
    </p>
}

@section scripts {
    <script>
        $(function () {
            // stop validator from ignoring hidden fields
            var validator = $('form').data('validator');
            validator.settings.ignore = "";

            // schoolname autocomplete
            $('#SchoolName').autocomplete({
                minLength: 1,
                source: [
                    { label: "ABC University", value: "1" },
                    { label: "Oklahoma University", value: "2" },
                    { label: "Texas University", value: "3" }
                ],
                select: function (e, ui) {
                    e.preventDefault();
                    $('#SchoolId').val(ui.item.value);
                    $('#SchoolName').val(ui.item.label);
                }
            });
        });
    </script>
}

Заранее спасибо.


редактировать

Sparky, вот отрендеренный HTML:

<form action="/" method="post">
    <p>
        <label for="SchoolName">SchoolName</label>
        <input id="SchoolName" name="SchoolName" type="text" value="" />
        <input data-val="true" data-val-number="The field SchoolId must be a number." data-val-required="The SchoolId field is required." id="SchoolId" name="SchoolId" type="hidden" value="" />
        <span class="field-validation-valid" data-valmsg-for="SchoolId" data-valmsg-replace="true"></span>
    </p>
    <p>
        <input type="submit" />
    </p>
</form>

1 ответ

Решение

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

Тем не менее, вы можете программно запустить проверочный тест в любом поле, вызвав .valid() метод в любое время.

$('input[name="field"]').valid();  // force validation of 'input name="field"'

Вот грубая демонстрация jsFiddle: http://jsfiddle.net/LJzfu/

  • Нажмите "отправить", чтобы отобразить "обязательное" сообщение на скрытом вводе field2, который не имеет значения.

  • Нажатие кнопки "go" программно помещает значение в скрытый ввод. Форма теперь будет технически проходить проверку (после отправки), но сообщение об ошибке остается, потому что у нас нет триггера проверки.

  • Активировать проверку по телефону .valid() сразу после помещения значения в скрытое поле. Это вызывает проверку правильности скрытого поля, которая затем скрывает сообщение об ошибке (при условии соблюдения правил проверки).