Ich habe seit einiger Zeit versucht, MVC Jquery dazu zu bringen, dass die unauffällige Fehlerbehandlung mit Twitter-Bootstrap funktioniert. Das war der Punkt, an dem ich entweder jquery.validate editieren oder ein paar Hacks und Schrägstriche an document.ready machen werde.

Damit die unauffällige Fehlerbehandlung mit Bootstrap und MVC funktioniert, muss sie als 'error'-Klasse an die' control-group'-Klasse angehängt werden. Außerdem wird die Klasse 'error' an die Eingabe angehängt.

Ich habe mich gefragt, ob jemand in der Community bereits eine Lösung gefunden hat.

Zum Beispiel

Ein typisches Bootstrap-Markup würde so aussehen ...

<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>

Was sollte passieren, wenn jquery.validate unauffällige Brände verwischt ... es würde sich wie folgt ändern

<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>

Damit dies bei Postback / Submit funktioniert, können Sie Folgendes tun ...

<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>

Bei Unschärfe funktioniert dies jedoch nicht wie erwartet. Ich möchte die Bootstrap-CSS- oder Jquery.validate-Dateien nicht bearbeiten, da sie wahrscheinlich irgendwann ein Update bereitstellen werden.

Würde ich einen Delegaten oder eine Bindung an die jquery-Funktionen erstellen und von dort aus arbeiten? Dies ist ein tiefer JS-Code, mit dem ich nicht vertraut bin, der sich aber mit der Zeit durchkämpfen könnte.

Weiß jemand, wo ich mit diesem Problem anfangen würde oder wo es implementiert / besprochen wurde?