asp.net mvc - side - Usar BootstrapValidator con MVC DataAnnotations

shopping cart asp net mvc

Question

Estoy usando DataAnnotations para especificar mis reglas de validación y, de forma predeterminada, estas reglas de validación se agregan en el lado del cliente para que puedan ser validadas por jquery.

Me gustaría utilizar BootstrapValidator.js ya que me gusta la forma en que se procesan los mensajes de error / éxito. Sin embargo, me obliga a redefinir las reglas de validación en el lado del cliente. Se puede encontrar un artículo sobre BootstrapValidator.js .

¿Hay alguna forma de que pueda usar DataAnnotations y definir las reglas en un solo lugar y seguir usando BootstrapValidator?

¿Alguna idea?

Answer 1

No es necesario redefinir las reglas de validación de nuevo. Simplemente puede integrar la validación de tipo MVC (que es el complemento de validación de Jquery ) con estilo de Bootstrap al soltar un guión rápido y hacer referencia a él después de sus scripts de validación de 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");
        }
    });
} ();