Использование BootstrapValidator с MVC DataAnnotations

Я использую DataAnnotations, чтобы указать мои правила проверки, и по умолчанию эти правила проверки добавляются на стороне клиента для их проверки с помощью jquery.

Я хотел бы использовать BootstrapValidator.js, так как мне нравится способ получения сообщений об ошибках/успехах. Тем не менее, это требует от меня переопределения правил проверки на стороне клиента. Можно найти статью о BootstrapValidator.js.

Есть ли способ, которым я могу использовать DataAnnotations и определять правила в одном месте и все еще использовать BootstrapValidator?

Любые мысли?

Ответ 1

Не нужно переопределять правила проверки. Вы можете просто интегрировать проверку типов MVC (которая JQuery Validation Plugin) с стилем Bootstrap, отбросив быстрый script и ссылаться на него после ваших сценариев проверки MVC:

$(function () {
    $('span.field-validation-valid, span.field-validation-error').each(function () {
        $(this).addClass('help-inline');
    });

    $('.validation-summary-errors').each(function () {
        $(this).addClass('alert');
        $(this).addClass('alert-error');
        $(this).addClass('alert-block');
    });

    $('form').submit(function () {
        if ($(this).valid()) {
            $(this).find('div.control-group').each(function () {
                if ($(this).find('span.field-validation-error').length == 0) {
                    $(this).removeClass('error');
                }
            });
        }
        else {
            $(this).find('div.control-group').each(function () {
                if ($(this).find('span.field-validation-error').length > 0) {
                    $(this).addClass('error');
                }
            });
            $('.validation-summary-errors').each(function () {
                if ($(this).hasClass('alert-error') == false) {
                    $(this).addClass('alert');
                    $(this).addClass('alert-error');
                    $(this).addClass('alert-block');
                }
            });
        }
    });

    $('form').each(function () {
        $(this).find('div.control-group').each(function () {
            if ($(this).find('span.field-validation-error').length > 0) {
                $(this).addClass('error');
            }
        });
    });

    $("input[type='password'], input[type='text']").blur(function () {
        if ($(this).hasClass('input-validation-error') == true || $(this).closest(".control-group").find('span.field-validation-error').length > 0) {
            $(this).addClass('error');
            $(this).closest(".control-group").addClass("error");
        } else {
            $(this).removeClass('error');
            $(this).closest(".control-group").removeClass("error");
        }
    });
});

var page = function () {
    //Update that validator
    $.validator.setDefaults({
        highlight: function (element) {
            $(element).closest(".control-group").addClass("error");
        },
        unhighlight: function (element) {
            $(element).closest(".control-group").removeClass("error");
        }
    });
} ();