Ненавязчивая проверка MVC3 переносит проверку в пользовательский элемент - PullRequest
1 голос
/ 18 октября 2011

Серверная часть Я рендерим скрытое поле, затем я использую виджет jquery, называемый flexbox, для создания комбинированного списка, он создает клиентскую часть элемента ввода и копирует выбранный идентификатор (не текст) в скрытое поле, как только вы выбираете что-то в поле.

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

Это работает, но ужасно чертовски, хотелось бы лучшего решения

var oldClass = $hdn.attr('class');

setInterval(function () {
    if (oldClass != $hdn.attr('class')) {
        $input.removeClass(oldClass);
        oldClass = $hdn.attr('class');
        $input.addClass($hdn.attr('class'));
    }
}, 200);

Спасибо.

Ответы [ 3 ]

3 голосов
/ 18 октября 2011

Если у меня проверяется скрытый элемент, я добавляю пользовательский атрибут data-val-visibleid. Затем в jquery.validate.js я изменяю функции highlight и unhighlight, добавляя следующее в конце обеих функций:

if ($(element).is(":hidden")) {
    var targetId = $(element).attr("data-val-visibleid");
    $("#" + targetId).addClass(errorClass).removeClass(validClass);
}

Некоторые люди не любят вмешиваться в jquery.validate.js, но, как правило, это самый простой способ выполнить настройки, подобные этой.

UPDATE

Я провел некоторое исследование и обнаружил, что в jquery.validate есть отличный метод setDefault, в котором вы можете переопределить функции по умолчанию, такие как highlight () и unhighlight. Добавьте следующее на свою страницу после загрузки других скриптов:

$.validator.setDefaults( {
    highlight: function (element, errorClass, validClass) {
        $(element).addClass(errorClass).removeClass(validClass);
        if ($(element).is(":hidden")) {
            var targetId = $(element).attr("data-val-visibleid");
            $("#" + targetId).addClass(errorClass).removeClass(validClass);
        }
    },
    unhighlight: function (element, errorClass, validClass) {
        $(element).removeClass(errorClass).addClass(validClass);
        if ($(element).is(":hidden")) {
            var targetId = $(element).attr("data-val-visibleid");
            $("#" + targetId).addClass(errorClass).removeClass(validClass);
        }
    }
});

Это переопределит функции по умолчанию, не изменяя базовый скрипт.

1 голос
/ 10 августа 2014

Я нашел оба этих ответа очень полезными и просто хотел бы добавить для всех, кто использует версию 1.9.0 плагина Validation, что вам нужно будет переопределить поведение по умолчанию, которое игнорирует скрытые поля, как подробно описано в этом другом посте: jQuery Validate - включить проверку для скрытых полей

1 голос
/ 19 октября 2011

Благодаря Counsellorben я нашел хорошее решение, хотя сделал это немного по-другому. Сначала я переопределяю методы по умолчанию в моем конструкторе главного объекта, который создан в document.ready. Однако document.ready слишком поздно, и ваши методы не сработают при выполнении проверки запуска из form.valid (), однако сработают при выполнении отправки (очень странно), этот код работает как для отправки, так и для запуска из сценария

(function() {
    var highlight = $.validator.defaults.highlight;
    var unhighlight = $.validator.defaults.unhighlight;

    $.validator.setDefaults({
        highlight: function (element, errorClass, validClass) {
            if ($(element).attr("data-val-visualId") != null) {
                element = $("#" + $(element).attr("data-val-visualId"))[0];
            }
            highlight(element, errorClass, validClass);
        },
        unhighlight: function (element, errorClass, validClass) {
            if ($(element).attr("data-val-visualId") != null) {
                element = $("#" + $(element).attr("data-val-visualId"))[0];
            }
            unhighlight(element, errorClass, validClass);
        }
    });
})();
...