Eu tenho tentado obter MVC Jquery tratamento de erros discreto trabalhando com bootstrap twitter já há algum tempo. Chegou ao ponto em que eu vou editar o jquery.validate ou fazer alguns hacks e slash no document.ready.

A fim de obter um tratamento de erros discreto para trabalhar com o Bootstrap e o MVC, preciso torná-lo a classe 'error' anexada à classe 'control-group'. Além disso, a classe 'error' é anexada à entrada.

Eu queria saber se alguém da comunidade já encontrou uma solução.

Por exemplo

Marcação típica de bootstrap seria assim ...

<code><div class="control-group">
    <label for="Username">Username</label>
    <div class="controls">
        <input data-val="true" data-val-required="Username is required" id="Username" name="Username" type="text" value="" />
        <span class="field-validation-valid" data-valmsg-for="Username" data-valmsg-replace="true"></span>
    </div>
</div>
</code>

O que deveria acontecer, no blur quando jquery.validar incêndios discretos ... mudaria para o seguinte

<code><div class="control-group error">
    <label for="Username">Username</label>
    <div class="controls">
        <input data-val="true" data-val-required="Username is required" id="Username" name="Username" type="text" value="" />
        <span class="field-validation-valid help-inline" data-valmsg-for="Username" data-valmsg-replace="true"></span>
    </div>
</div>
</code>

Para fazer isso funcionar no postback / submit você pode fazer o seguinte ...

<code>//twitter bootstrap on post
$(function () {
    $('span.field-validation-valid, span.field-validation-error').each(function () {
        $(this).addClass('help-inline');
    });

    $('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');
                }
            });
        }
    });


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

});
</code>

No entanto, no desfoque, não funcionará como seria de esperar. Não quero editar os arquivos CSS ou Jquery.validate de bootstrap, pois eles provavelmente lançarão uma atualização em algum ponto.

Eu criaria um delegado ou uma ligação às funções jquery e trabalharia a partir daí. Este é o código JS profundo que eu não estou familiarizado, mas poderia com o tempo de combate a minha maneira através dele.

Alguém sabe onde eu comecei com esse problema, ou sabe onde ele é implementado / foi discutido?