jqueryの検証

Question

とデータの属性を使用すると、jQueryの検証プラグインでのデータの属性を使用することが可能です。私は現在クラス名を使用しています。

class="{required:true, messages:{required:'You must choose a site.'}}"` 

などのデータ属性を使用する必要があります。

data-validate="{required:true, messages:{required:'You must choose a site.'}}"` 

入力には、検証に関係しない複数のデータ属性が関連付けられている場合があります。

<input name="txt_txt001" type="text" maxlength="30" id="txt_txt001" class= "  
{required:true, messages:{required:'This field is required.'} }" data- 
children="ddl_txt007,ddl_txt008" data-optionGroup="1" data-optionGroupParent="" /> 

私はケチャッププラグインがこれを提供しています知っているが、私はjQueryの検証でページ設定を取得するに作業の負荷をかけてきたように、それを上に移動したくありません。

おかげ

Answer 1

私はプラグインを使用しhaventは、それはルールを取得し、そこから属性を変更するには、組み込みのオプションがあるようには思えません。しかし、767の非圧縮ソースを見ると、classRulesメソッドが表示されます。

var classes = $(element).attr('class'); 

あなたはこれを変更しようとすることができます：ライン769であり、この方法では

var classes = $(element).attr('data-validate'); 

としては、それがより論理的かつ意味的なようだが、私は、これをテストhaventは、言いましたプラグインがデフォルトごとに提案するように、この種のものをクラスよりもデータ属性に入れることです。

Answer 2

ASP.NET MVC 3は、HTML5 data-属性を使用して控えめな検証が組み込まれています。 MVC 3の枠組み内のファイルjquery.validate.unobtrusive.jsは、データ - 属性を解析し、jquery.validate.jsにルールを追加します。

あなたはthis articleで詳細を取得することができます。

Answer 3

は1.9.0を検証するために、次のchagesを作ってみましょう。私の行番号がずれることがありますので、 私はいくつかの改造を行ったが、ここに行く：149 LNアラウンド

：

// pretty much steal everything from the class based settings 
dataRules: function(element) { 
    var rules = {}; 
    var classes = $(element).data("validation"); 
    classes && $.each(classes.split(' '), function() { 
     if (this in $.validator.classRuleSettings) { 
      $.extend(rules, $.validator.classRuleSettings[this]); 
     } 
    }); 
    return rules; 
}, 

：

var data = $.validator.normalizeRules(
    $.extend(
     {}, 
     $.validator.metadataRules(element), 
     $.validator.classRules(element), 
     $.validator.dataRules(element), // add this 
     $.validator.attributeRules(element), 
     $.validator.staticRules(element) 
    ), element); 

は約classRules後にこれを追加782 LNクラスルールに追加のバリデータを追加します。

jQuery.validator.addClassRules({ 
    phone: { 
     phoneUS: true 
    }, 
    zipcode: { 
     zipcode: true 
    }, 
    notFirstSelect: { 
     notFirstSelect : true 
    } 
}); 

data-validationあなたのフィールドに属性：

<input type="text" data-validation="zipcode required" maxlength="10" class="inputText med" value="" name="zip" id="zip"> 

これは本当にうまくいっています。この使用例については、http://www.roomandboard.com/rnb/business_interiors/contactus/send.doを参照してください。

Answer 4

私は、これは古いですけど、私はただ、関連する何かを探し、それにつまずきました。受け入れられた答えがないので、私はまだあなたが1つを必要としているかもしれないと考えましたか？とにかく、デビッドは本当に近いた：

var classes = $(element).data("validate");

これはあなたのデータ-validate属性の内容をつかむ必要があります。そこから、クラス名を使っているときと同じように、値を解析したり渡すことができるはずです。

Answer 5

data-attriubtesを使用することをお勧めします。 jquery.validate.unobtrusive.jsはもう必要ありません。バージョン1.11.0では、jquery.validate.jsにデフォルトで含まれています。構文は同じですが、ここでサンプルを見てください： http://denverdeveloper.wordpress.com/2012/09/26/some-things-ive-learned-about-jquery-unobtrusive-validation/