使用數據屬性jQuery驗證

是否有可能使用JQuery驗證插件的數據屬性。我目前使用的是課程名稱，例如使用數據屬性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驗證搬過來吧。

感謝

來源

2011-09-26 Clawg

我還沒有使用的插件，但似乎沒有成爲一個內置的選項可以更改屬性從那裏獲取的規則。但是，如果您查看線路767處的未壓縮源，則會看到classRules方法。

在這種方法中，在行769有：

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

你可以嘗試這種更改爲：

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

至於說，我還沒有測試這一點，但它似乎更符合邏輯和語義把這種東西放在一個數據屬性中，而不是像插件所建議的那樣默認。

來源

2011-09-26 18:38:06 David

嗨大衛，我給你的建議去了，但我無法得到它的工作。謝謝 – Clawg

更可能：$（element）.data（'validate'）; – molokoloco

ASP.NET MVC 3整合了使用HTML5 data-屬性的不顯眼驗證。 MVC 3框架中的文件jquery.validate.unobtrusive.js解析數據屬性，並將規則添加到jquery.validate.js中。

您可以在this article中獲得更多詳情。

來源

2011-09-27 11:36:12 counsellorben

嘗試使下列chages驗證1.9.0。我做了一些MODS的，所以我的行號可能會關閉，但在這裏有雲：

圍繞LN 149：

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

classRules後加入這個局面LN 782：

// 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; 
},

添加任何額外的驗證器到類規則：

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作爲使用中的示例。

來源

2012-05-18 15:38:27 RubyRed

這真的很酷，但我認爲你正在重新發明輪子。對於大多數主要平臺，已經有不引人注目的驗證生成器和解析器 – Milimetric

我知道這是舊的，但我只是偶然發現它尋找相關的東西。我想，因爲沒有被接受的答案，你可能仍然需要一個？無論如何，大衛真的接近：

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

這應該抓住你的數據驗證屬性的內容。從那裏你應該能夠解析或傳遞值，就像你使用類名所做的那樣。

來源

2013-01-09 22:17:17

建議使用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/

來源

2014-02-25 13:47:25 ValGe

您是否可以更新此鏈接？ – peater

當然：https：//spabuilder.wordpress.com/2012/09/26/some-things-ive-learned-about-jquery-unobtrusive-validation/ 還修復了上述評論中明顯的錯字（您不不再需要不顯眼的部分） – ValGe

使用數據屬性jQuery驗證

回答

相關問題