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

Posted 2023-05-09

【中文标题】jQuery Validate - 启用隐藏字段的验证

【英文标题】：jQuery Validate - Enable validation for hidden fields

【发布时间】：2018-06-21 07:07:30

【问题描述】：

在新版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" 并对其进行注释。 对此发表评论后，它将永远不会丢失任何要验证的隐藏元素...

谢谢

【讨论】：

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