カスタム要素への邪魔にならない検証のMVC3のバリデーション

Question

Serverside私は非表示フィールドをレンダリングし、flexboxというjqueryウィジェットを使用してコンボボックスを作成し、入力要素のクライアント側を作成し、非表示フィールドボックス内の何かを選択すると

問題は、バリデーションコードがバリデーションに何か問題があるときにクラス名を追加し、入力エレメントに追加したい場合、クラス名が追加されたときに何か聞くことができるか、クラス名を入力フィールドに移動します。

これは動作しますが、地獄のようにその醜い、よりよい解決策に

var oldClass = $hdn.attr('class'); 

setInterval(function() { 
    if (oldClass != $hdn.attr('class')) { 
     $input.removeClass(oldClass); 
     oldClass = $hdn.attr('class'); 
     $input.addClass($hdn.attr('class')); 
    } 
}, 200); 

感謝したいと思います。

Answer 1

Counsellorborbenのおかげで、私は良い解決策を見つけましたが、私はやや異なった方法でそれをやっていました。 まず、document.readyで構築されたマスターオブジェクトコンストラクタのデフォルトメソッドをオーバーライドします。しかし、document.readyは遅すぎ、form.valid（）からトリガー検証を実行するときにメソッドがトリガーされません。ただし、送信（非常に奇妙）するとトリガーされます。このコードはサブミットとスクリプトからトリガーされます

(function() { 
    var highlight = $.validator.defaults.highlight; 
    var unhighlight = $.validator.defaults.unhighlight; 

    $.validator.setDefaults({ 
     highlight: function (element, errorClass, validClass) { 
      if ($(element).attr("data-val-visualId") != null) { 
       element = $("#" + $(element).attr("data-val-visualId"))[0]; 
      } 
      highlight(element, errorClass, validClass); 
     }, 
     unhighlight: function (element, errorClass, validClass) { 
      if ($(element).attr("data-val-visualId") != null) { 
       element = $("#" + $(element).attr("data-val-visualId"))[0]; 
      } 
      unhighlight(element, errorClass, validClass); 
     } 
    }); 
})(); 

Answer 2

ここで、非表示の要素が検証されている場合は、カスタム属性data-val-visibleidを追加します。その後、jquery.validate.jsで、私は両方の機能の末尾に以下を追加することにより、highlightとunhighlight機能を変更します。

if ($(element).is(":hidden")) { 
    var targetId = $(element).attr("data-val-visibleid"); 
    $("#" + targetId).addClass(errorClass).removeClass(validClass); 
} 

一部の人々はjquery.validate.jsに干渉するのが好きではありませんが、それは通常、最も簡単ですメソッドを使用して、このようなカスタマイズを実現します。

UPDATE

私はいくつかの研究を行った、とjquery.validateは気の利いたsetDefaultあなたは、このようなハイライトとして、デフォルトの機能を、（オーバーライドできるメソッド、）とのハイライトを消しを持っていることを発見しました。

$.validator.setDefaults({ 
    highlight: function (element, errorClass, validClass) { 
     $(element).addClass(errorClass).removeClass(validClass); 
     if ($(element).is(":hidden")) { 
      var targetId = $(element).attr("data-val-visibleid"); 
      $("#" + targetId).addClass(errorClass).removeClass(validClass); 
     } 
    }, 
    unhighlight: function (element, errorClass, validClass) { 
     $(element).removeClass(errorClass).addClass(validClass); 
     if ($(element).is(":hidden")) { 
      var targetId = $(element).attr("data-val-visibleid"); 
      $("#" + targetId).addClass(errorClass).removeClass(validClass); 
     } 
    } 
}); 

これは、基本となるスクリプトを変更せずに、デフォルトの機能を上書きします。

Answer 3

私は両方のこれらの答えは非常に有用であることが判明し、ちょうどあなたがこの他のポストで説明するように隠しフィールドを無視するデフォルトの動作をオーバーライドする必要があります検証プラグインのバージョン1.9.0を使用して、誰のために追加したい：jQuery Validate - Enable validation for hidden fields