5

是否可以将数据属性与 JQuery Validate 插件一起使用。我目前使用类名,例如

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 Validate 设置页面。

谢谢

4

5 回答 5

6

尝试进行以下更改以验证 1.9.0。我做了一些修改,所以我的行号可能是关闭的,但这里是:

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

在 ln 782 附近的 classRules 之后添加:

// 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为您的 for 字段添加一个属性:

<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-18T15:38:27.067 回答
1

我没有使用过该插件,但似乎没有内置选项可以从它获取规则的位置更改属性。但是,如果您查看 line 处的未压缩源代码767,您会看到一个classRules方法。

在此方法中,769有:

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

您可以尝试将其更改为:

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

如前所述,我没有对此进行测试,尽管将这种东西放在数据属性中似乎比插件默认建议的类更合乎逻辑和语义。

于 2011-09-26T18:38:06.967 回答
1

我知道这很旧,但我只是偶然发现它正在寻找相关的东西。我想既然没有公认的答案,你可能还需要一个?无论如何,大卫真的很接近:

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

这应该获取您的 data-validate 属性的内容。从那里你应该能够解析或传递你正在/正在使用类名的值。

于 2013-01-09T22:17:17.587 回答
1

data-ASP.NET MVC 3 结合了使用 HTML5属性的不显眼的验证。MVC 3 框架中的文件jquery.validate.unobtrusive.js解析 data- 属性,并将规则添加到jquery.validate.js.

您可以在本文中获得更多详细信息。

于 2011-09-27T11:36:12.310 回答
0

推荐使用数据属性。你不再需要 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-25T13:47:25.057 回答