jQuery Validate - 启用隐藏字段的验证

Posted

技术标签:

【中文标题】jQuery Validate - 启用隐藏字段的验证【英文标题】:jQuery Validate - Enable validation for hidden fields 【发布时间】:2012-01-17 23:51:27 【问题描述】:

在新版jQuery验证插件1.9中默认validation of hidden fields ignored。我将 CKEditor 用于 textarea 输入字段,它隐藏了该字段并将其替换为 iframe。该字段在那里,但对隐藏字段禁用了验证。使用验证插件 1.8.1 版,一切正常。

所以我的问题是如何使用 v1.9 验证插件启用对隐藏字段的验证。

此设置无效:

$.validator.setDefaults( ignore: '' );

【问题讨论】:

另见***.com/questions/7952181/… “忽略隐藏字段的验证”的链接已失效。 默认情况下,我使用<input type="text" name="myfield" id="myfield" required="required" style="display: none;"> 进行验证。我不必更改任何设置或做任何特别的事情。 【参考方案1】:

插件的作者说你应该使用“不带引号的方括号”[]

http://bassistance.de/2011/10/07/release-validation-plugin-1-9-0/

发布:验证插件 1.9.0: “...另一个更改应该是设置带有隐藏元素的表单 更简单,这些现在默认被忽略(选项“忽略”有 “:隐藏”现在作为默认值)。从理论上讲,这可能会破坏现有的 设置。在不太可能的情况下,您可以通过以下方式修复它 将忽略选项设置为“[]”(方括号不带 引号)。”

要更改所有表单的此设置:

$.validator.setDefaults( 
    ignore: [],
    // any other default options and/or rules
);

.setDefaults() 不需要在document.ready 函数内)

OR 表示一种特定的形式:

$(document).ready(function() 

    $('#myform').validate(
        ignore: [],
        // any other options and/or rules
    );

);

编辑

请参阅this answer,了解如何在某些隐藏字段上启用验证但仍忽略其他字段。


编辑 2

在离开 “这不起作用” 的 cmets 之前,请记住,OP 只是在询问 the jQuery Validate plugin,而他的问题与 无关 如何ASP.NET、MVC 或任何其他 Microsoft 框架可以改变此插件的正常预期行为。如果您使用的是 Microsoft 框架,则 jQuery Validate 插件的默认功能会被 Microsoft 的 unobtrusive-validation 插件覆盖。

如果您在使用 unobtrusive-validation 插件时遇到问题,请参阅此答案:https://***.com/a/11053251/594235

【讨论】:

也许反对者可以给我一些建设性的反馈。否则,答案是完全独立的,来源正确,给出了代码示例,并且根据插件的作者在技术上是正确的。 @StijnVanBael,不,这是错误的。请参阅:jsfiddle.net/F4w92/1,另请参阅我对 jerick's answer 的第二条评论。 @Sparky 说得好。否决票可能是一种报复,我也遇到过同样的情况.. JSFiddle 不再起作用,因为库是在 HTTP 而不是 HTTPS 中加载的。更新版本:jsfiddle.net/F4w92/31 我也投了反对票,因为这对我使用最新版本不起作用,必须使用:$("form").data("validator").settings.ignore = "";作为@James bellow的其他回答【参考方案2】:

这对我有用,在一个 ASP.NET MVC3 站点中,我离开了框架来设置不显眼的验证等,以防它对任何人有用:

$("form").data("validator").settings.ignore = "";

【讨论】:

我也喜欢这个,因为这意味着我可以在某些情况下做到这一点,而不是改变默认行为。 我不得不这样做,因为使用 .validate() 更改选项不起作用。 这是不显眼验证的正确解决方案,我尝试了所有其他解决方案,它们可以在不使用不显眼的情况下工作。如果你在这里使用不显眼的地方是正确的。 必须使用此方法进行不显眼的验证才能与 Bootstrap Accordion 一起使用 当我将其更改为此表单时,表单未经过验证。我使用不显眼的 .net 核心【参考方案3】:

一定要放

 $.validator.setDefaults( ignore: '' );

$(document).ready

【讨论】:

优秀的答案。文档链接有利于人们学习,但直接回答更有价值。他的 OP 是在正确的轨道上,但把它放在 $(document).ready 之外是诀窍。 @KevinZych,显然,$.validator.setDefaults() 放在 DOM 就绪处理程序的内部还是外部完全没有区别。比较 this jsFiddle 和 this jsFiddle。 有趣的@Sparky,你的小提琴就是很好的证明。我必须回去查看我使用此解决方案修复的代码,并找出为什么我得出的结论是它必须位于 DOM 就绪处理程序内部。一定是其他原因。 Justin 解释了为什么在 doc ready 中运行会导致问题。但是,这个答案不是一个好的选择,因为很难保证 doc ready 之外的东西会在 doc ready 之前运行。 Doc.ready 不会等待它之外的脚本运行。没什么私人的,但这不是一个可靠的答案。 终于有答案了..非常感谢【参考方案4】:

所以我要更深入地解释为什么这不起作用,因为我是那种晚上睡不着觉的人哈哈。我正在使用 2013 年 1 月 29 日发布的 jQuery validate 1.10 和 Microsoft jQuery Unobtrusive Validation 2.0.20710.0。

我首先在 jQuery Validate 中搜索 setDefaults 方法,并在未压缩文件的第 261 行找到它。这个函数真正做的就是将你的 json 设置合并到现有的 $.validator.defaults 中,这些设置在初始化时将忽略属性设置为 ":hidden" 以及 jQuery Validate 中定义的其他默认值。所以在这一点上,我们已经覆盖了忽略。现在让我们看看这个默认属性在哪里被引用。

当我跟踪代码以查看 $.validator.defaults 被引用的位置时。我注意到它仅被构造函数用于表单验证器,jQuery validate unminified file 中的第 170 行。

// constructor for validator
$.validator = function( options, form ) 
    this.settings = $.extend( true, , $.validator.defaults, options );
    this.currentForm = form;
    this.init();
;

此时验证器将合并任何已设置的默认设置并将其附加到表单验证器。当您查看正在执行验证、突出显示、取消突出显示等操作的代码时,它们都使用 validator.settings 对象来拉取忽略属性。所以我们需要确保如果我们要使用 setDefaults 方法设置忽略,那么它必须在调用 $("form").validate() 之前发生。

如果您使用的是 Asp.net MVC 和不显眼的插件,那么您会在查看在 document.ready 中调用 validate 的 javascript 后意识到。我还调用了我的 setDefaults在将在脚本之后执行的 document.ready 块中,jquery 验证并且不显眼,因为我已经在 html 中定义了这些脚本,然后是其中包含调用的脚本。所以我的调用显然对验证期间跳过隐藏元素的默认功能没有影响。这里有几个选项。

选项 1 - 正如 Juan Mellado 指出的那样,您可以在 document.ready 之外进行调用,该调用将在脚本加载后立即执行。我不确定这样做的时间,因为浏览器现在能够进行并行脚本加载。如果我只是过于谨慎,请纠正我。此外,可能有解决此问题的方法,但出于我的需要,我没有走这条路。

选项 2a - 在我看来,安全的选择是将 document.ready 事件中的 $.validator.setDefaults( ignore: '' ); 替换为 $("form").data("validator").settings.ignore = "";。这将修改 jQuery validate 在对给定表单的元素进行每次验证时实际使用的忽略属性。

选项 2b - 在进一步查看代码之后,您还可以使用 $("form").validate().settings.ignore = ""; 作为设置忽略属性的一种方式。原因是在查看 validate 函数时,它会通过 $.data() 函数检查是否已经为表单元素存储了验证器对象。如果它找到与表单元素一起存储的验证器对象,那么它只会返回验证器对象,而不是创建另一个。

【讨论】:

感谢您的详细解答! 干得好,因为 OP 答案在 MVC 5 中对我不起作用 您的分析帮助我解决了一个验证问题。 +1【参考方案5】:

这在 ASP.NET 站点中对我有用。 要对某些隐藏字段启用验证,请使用此代码

$("form").data("validator").settings.ignore = ":hidden:not(#myitem)";

要对表单的所有元素启用验证,请使用这个 $("form").data("validator").settings.ignore = "";

注意在$(document).ready(function() )中使用它们

【讨论】:

【参考方案6】:

刚刚在特定表单的特定页面中添加了ignore: [],这个解决方案对我有用。

$("#form_name").validate(
        ignore: [],
        onkeyup: false,
        rules:             
        ,      
        highlight:false,
    );

【讨论】:

【参考方案7】:

这对我有用。

jQuery("#form_name").validate().settings.ignore = "";

【讨论】:

【参考方案8】:

验证在表单提交时为我工作,但它没有对所选选择列表的输入进行反应性事件驱动验证。

为了解决这个问题,我添加了以下内容以手动触发库添加的 jquery 验证事件:

$(".chosen-select").each(function() 
  $(this).chosen().on("change", function() 
    $(this).parents(".form-group").find("select.form-control").trigger("focusout.validate");
  );
);

jquery.validate 现在会将.valid 类添加到底层选择列表中。

警告:这确实需要您的表单输入使用一致的 html 模式。就我而言,每个输入字段都包含在div.form-group 中,每个输入都有.form-control

【讨论】:

【参考方案9】:

只需在您的 jquery 验证文件中找到文本 ignore: ":hidden" 并对其进行注释。 对此发表评论后,它将永远不会丢失任何要验证的隐藏元素...

谢谢

【讨论】:

随意注释掉第三方库中的代码绝不是个好主意。

以上是关于jQuery Validate - 启用隐藏字段的验证的主要内容,如果未能解决你的问题,请参考以下文章

如果使用 jtable 事件满足某个条件,则启用 jquery-jtable 隐藏字段

当 jquery.validate 验证表单时启用提交按钮

jQuery validate验证表单隐藏域

JQuery的validate验证时 如何验证下拉框是否选中

如果表单已验证,则替换/隐藏输入按钮(使用 jquery.validate.js)

如何使用 jquery 启用表单的提交按钮?