jQuery Validation插件忽略的元素得到验证

大卫

我使用jQuery验证插件验证表单。如果浏览器支持HTML5 datetime-local元素,则我希望该输入不被验证。一切工作正常,除了带有ignore类的元素仍得到验证。

Chrome中的HTML(具有本地日期时间支持)

<form action="/Events/EditEventInfo/37" id="EditForm" method="post" novalidate="novalidate"><input name="__RequestVerificationToken" type="hidden" value="bg5O93sGSgPSWzzsaMfKzd0FPWddBBw9ZYC4srs5xBWmJgsBKWjmD2TL0OXyQNwGl1fa7orAp08pCL1RLxzlSdbNWc9YUxxd1rxGrpw0fhgINRnd3vXoCzG5bDhe2ySk77kXfCfyEJvy-uvYRIbA8Q2">    <div class="form-horizontal">
    <div class="form-group">
        <label for="StartDate" class="control-label col-md-2">Startdatum</label>
        <div class="col-md-10">
            <input id="StartDate" name="StartDate" class="form-control ignore error" type="datetime-local" required="" aria-required="true" aria-invalid="true"><label id="StartDate-error" class="error" for="StartDate">Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an.</label>
        </div>
    </div>

    <div class="form-group">
        <label for="EndDate" class="control-label col-md-2">Enddatum</label>
        <div class="col-md-10">
            <input id="EndDate" name="EndDate" class="form-control ignore error" type="datetime-local" required="" aria-required="true"><label id="EndDate-error" class="error" for="EndDate">Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an.</label>
        </div>
    </div>

    <div class="form-group">
        <label for="Name" class="control-label col-md-2">Name</label>
        <div class="col-md-10">
            <input id="Name" name="Name" class="form-control valid" value="Party. Yolo." type="text" minlength="2" required="" aria-required="true">

        </div>
    </div>       
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Speichern" class="btn btn-default">
        </div>
    </div>
</div>

脚本:

<script type="text/javascript">    
$.validator.addMethod(
"deDateTime",
function (value, element) {
    //dd.MM.yyyy HH:mm
    var re = /^\d{2}\.\d{2}\.\d{4} \d{2}:\d{2}$/;
    return (this.optional(element) && value == "") || re.test(value);
},
"Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an."
);
if (DateTimeLocalSupport())
{
    $('#StartDate').val("@Model.StartDate.ToString("s")");
    $('#EndDate').val("@Model.EndDate.ToString("s")");
    //HTML5 input types are available, no need to validate those fields
    $('#StartDate').addClass("ignore");
    $('#EndDate').addClass("ignore");
}
else
{
    $('#StartDate').val("@Model.StartDate.ToString("dd.MM.yyyy HH:mm")");
    $('#EndDate').val("@Model.EndDate.ToString("dd.MM.yyyy HH:mm")");
}
$('#EditForm').validate({
    ignore: ".ignore :hidden",
    rules: {
        StartDate: {
            deDateTime: true
        },
        EndDate: {
            deDateTime: true
        }
    }
});
alert("Valid: " + $('#EditForm').valid());

</script>

检查对HTML5的支持,填充字段并添加类可以正常工作。验证插件仅还会验证其不应该验证的元素。

解:

ignore: '.ignore, :hidden'
活泼的

ignore: ".ignore :hidden"告诉它忽略类的隐藏字段ignore

ignore: ".ignore"会告诉它只忽略将要上课的字段.ignore

ignore: ".ignore, :hidden"会告诉它忽略字段将对.ignoreAND字段进行隐藏。


完全不指定该ignore选项,默认设置是ignore: ":hidden"仅忽略隐藏字段。

设置为ignore: []告诉插件什么也不要忽略,并验证所有内容。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用Jquery Validation插件进行行验证

来自分类Dev

jQuery Validation插件无法验证整个表单

来自分类Dev

jQuery验证插件,使用选项的数据元素作为验证检查

来自分类Dev

使用jQuery Validation插件成功验证后无法更新<div>

来自分类Dev

[contenteditable]元素和jQuery验证插件存在问题

来自分类Dev

jQuery验证插件单个元素的错误放置

来自分类Dev

jQuery插件的多个元素

来自分类Dev

jQuery Validation验证元素,即使设置为“ required:false”

来自分类Dev

如何使用jquery验证插件来验证select2元素?

来自分类Dev

如何使用 jQuery 验证插件在 keyup 上验证非表单元素中的输入

来自分类Dev

jQuery验证-忽略必需的规则

来自分类Dev

jQuery验证插件点击按钮

来自分类Dev

jQuery验证插件-“ lettersonly”功能

来自分类Dev

JQuery验证插件部分功能

来自分类Dev

jQuery验证插件:成功函数

来自分类Dev

JQuery 验证插件 onclick 链接

来自分类Dev

如何使用jQuery Validation插件验证正则表达式?

来自分类Dev

jQuery Validation插件-使用Bootstrap 3验证单选和复选框输入的混合

来自分类Dev

如何使用JQuery Validation插件来验证具有此特定约束的表单?

来自分类Dev

从jQuery插件访问AngularJS元素

来自分类Dev

使用jQuery验证插件未执行的验证

来自分类Dev

使用jQuery验证插件验证选择

来自分类Dev

jQuery验证插件:验证多个输入文件

来自分类Dev

jQuery验证插件基于模式的验证?

来自分类Dev

jQuery验证插件-不必要的验证

来自分类Dev

您是否必须在表单元素上使用JQuery Validation插件validate()?

来自分类Dev

将jQuery Validation插件与动态表单元素一起使用

来自分类Dev

jquery 不使用 jquery 验证插件验证表单

来自分类Dev

使用unobtrusive验证插件时,如何禁用针对1个特定html元素的keyup和focusout上的jquery验证?

Related 相关文章

  1. 1

    使用Jquery Validation插件进行行验证

  2. 2

    jQuery Validation插件无法验证整个表单

  3. 3

    jQuery验证插件,使用选项的数据元素作为验证检查

  4. 4

    使用jQuery Validation插件成功验证后无法更新<div>

  5. 5

    [contenteditable]元素和jQuery验证插件存在问题

  6. 6

    jQuery验证插件单个元素的错误放置

  7. 7

    jQuery插件的多个元素

  8. 8

    jQuery Validation验证元素,即使设置为“ required:false”

  9. 9

    如何使用jquery验证插件来验证select2元素?

  10. 10

    如何使用 jQuery 验证插件在 keyup 上验证非表单元素中的输入

  11. 11

    jQuery验证-忽略必需的规则

  12. 12

    jQuery验证插件点击按钮

  13. 13

    jQuery验证插件-“ lettersonly”功能

  14. 14

    JQuery验证插件部分功能

  15. 15

    jQuery验证插件:成功函数

  16. 16

    JQuery 验证插件 onclick 链接

  17. 17

    如何使用jQuery Validation插件验证正则表达式?

  18. 18

    jQuery Validation插件-使用Bootstrap 3验证单选和复选框输入的混合

  19. 19

    如何使用JQuery Validation插件来验证具有此特定约束的表单?

  20. 20

    从jQuery插件访问AngularJS元素

  21. 21

    使用jQuery验证插件未执行的验证

  22. 22

    使用jQuery验证插件验证选择

  23. 23

    jQuery验证插件:验证多个输入文件

  24. 24

    jQuery验证插件基于模式的验证?

  25. 25

    jQuery验证插件-不必要的验证

  26. 26

    您是否必须在表单元素上使用JQuery Validation插件validate()?

  27. 27

    将jQuery Validation插件与动态表单元素一起使用

  28. 28

    jquery 不使用 jquery 验证插件验证表单

  29. 29

    使用unobtrusive验证插件时,如何禁用针对1个特定html元素的keyup和focusout上的jquery验证?

热门标签

归档