私は、しばらくの間、MVC Jquery の控えめなエラー処理を twitter ブートストラップで動作させようと試みてきました。jquery.validate を編集するか、document.ready でハック アンド スラッシュを実行するかのどちらかです。
Bootstrap と MVC で目立たないエラー処理を行うには、「エラー」クラスを「コントロール グループ」クラスに追加する必要があります。それに加えて、「エラー」クラスが入力に追加されます。
コミュニティの誰かがすでに解決策を見つけているかどうか疑問に思っていました.
例えば
典型的なブートストラップ マークアップは次のようになります...
<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>
jquery.validate unobtrusive が起動したときのぼかしで何が起こるべきか...次のように変更されます
<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>
これをポストバック/送信で機能させるには、次のことができます...
//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');
}
});
});
});
ただし、ぼかしでは期待どおりに機能しません。ブートストラップ CSS や Jquery.validate ファイルは編集したくありません。これらのファイルはいずれ更新される可能性が高いからです。
デリゲートを作成するか、jquery 関数にバインドしてそこから作業しますか。これは私がよく知らない深い JS コードですが、時間の経過とともに銃撃戦になる可能性があります。
この問題をどこから始めるか、またはどこで実装/議論されているかを知っている人はいますか?