javascript jQuery 验证:$.data($('form')[0], 'validator').settings 返回未定义
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/24575443/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery Validation: $.data($('form')[0], 'validator').settings returns undefined
提问by wertzui
I have an ASP.Net MVC Project and I am using unobtrusive jQuery Validation. to add validation when an element looses focus, I am calling
我有一个 ASP.Net MVC 项目,我正在使用不显眼的 jQuery 验证。在元素失去焦点时添加验证,我正在调用
$(document).ready(function () {
// enable validation when an input loses focus.
var settngs = $.data($('form')[0], 'validator').settings;
settngs.onfocusout = function (element) { $(element).valid(); };
});
This is working on one project while it throws this exception on another project because $.data($('form')[0], 'validator') returns undefined ($.data($('form')[0]) returns an empty object):
这是在一个项目上工作,而在另一个项目上抛出此异常,因为 $.data($('form')[0], 'validator') 返回 undefined ($.data($('form')[0])返回一个空对象):
Uncaught TypeError: Cannot read property 'settings' of undefined
未捕获的类型错误:无法读取未定义的属性“设置”
However jQuery Validation is working fine when the submit button is pressed, so everything else should be set up correctly.
然而,当按下提交按钮时 jQuery 验证工作正常,所以其他一切都应该正确设置。
I am loading these scripts at the end of the body tag: (the function listed above is in customvalidations.js so it should execute after the validator is applied to the form)
我在 body 标签的末尾加载这些脚本:(上面列出的函数在 customvalidations.js 中,所以它应该在验证器应用于表单后执行)
<script src="/Staffing/Scripts/jquery-2.1.1.js"></script>
<script src="/Staffing/Scripts/globalize/globalize.js"></script>
<script src="/Staffing/Scripts/globalize/cultures/globalize.culture.de-DE.js"></script>
<script src="/Staffing/Scripts/bootstrap.js"></script>
<script src="/Staffing/Scripts/respond.js"></script>
<script src="/Staffing/Scripts/bootstrap-datepicker.js"></script>
<script src="/Staffing/Scripts/bootstrap-datepicker-globalize.js"></script>
<script src="/Staffing/Scripts/locales/bootstrap-datepicker.de.js"></script>
<script src="/Staffing/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Staffing/Scripts/jquery.validate.js"></script>
<script src="/Staffing/Scripts/jquery.validate.globalize.js"></script>
<script src="/Staffing/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="/Staffing/Scripts/localization/messages_de.js"></script>
<script src="/Staffing/Scripts/customvalidations.js"></script>
<script src="/Staffing/Scripts/uiadditions.js"></script>
<script src="/Staffing/Scripts/default.js"></script>
Solution:This is the code that works:
解决方案:这是有效的代码:
$(document).ready(function () {
// enable validation when an input loses focus.
var allForms = $('form');
$.each(allForms, function (key, value) {
var val = $.data(value, 'validator');
if (val != undefined) {
var settngs = val.settings;
settngs.onfocusout = function (element) { $(element).valid(); };
}});
});
The problem was that the new Validation plugin Checks if there are any elements present which should be validated and i had 2 forms on the same page with the first form not having any validated input elements.
问题是新的验证插件检查是否存在任何应该验证的元素,并且我在同一页面上有 2 个表单,第一个表单没有任何经过验证的输入元素。
回答by sammy34
I just upgraded to Microsoft.jQuery.Unobtrusive.Validation.3.2.0 package. I came across the same problem. Is it possible that you also upgraded to the same version?
我刚刚升级到 Microsoft.jQuery.Unobtrusive.Validation.3.2.0 包。我遇到了同样的问题。是否有可能您也升级到相同版本?
If so, I might offer my two cents :). After a bit of debugging I noticed that the following change was made in jquery.validate.unobtrusive.js:
如果是这样,我可能会提供我的两美分:)。经过一番调试后,我注意到在 jquery.validate.unobtrusive.js 中进行了以下更改:
Previous version:
上一版本:
var $forms = $(selector)
.parents("form")
.andSelf()
.add($(selector).find("form"))
.filter("form");
New version:
新版本:
$forms = $selector.parents()
.addBack()
.filter("form")
.add($selector.find("form"))
.has("[data-val=true]"); // key point!
The key seems to be: the has("[data-val=true]")
. That is, if your form doesn't have any descendents (like an input element) with that attribute value, it will not be parsed by the validation helper and no 'validator' data will get assigned to that form element. You'll then get this 'undefined' error if you try to access the validator of that form at a later stage.
关键似乎是:has("[data-val=true]")
. 也就是说,如果您的表单没有具有该属性值的任何后代(如输入元素),则验证助手不会解析它,并且不会将“验证器”数据分配给该表单元素。如果您稍后尝试访问该表单的验证器,您将收到此“未定义”错误。
In my case, the forms for which this was happening didn't actually use any validation, hence they didn't have this attribute. I was then able to change my custom validator logic to first check if the validator exists before changing validator settings.
就我而言,发生这种情况的表单实际上并未使用任何验证,因此它们没有此属性。然后我能够更改我的自定义验证器逻辑,以在更改验证器设置之前首先检查验证器是否存在。
Hope that helps.
希望有帮助。
回答by Patrice Gagnon
This can happen also you you didn't call validate() on your form as such:
这也可能发生在您没有在表单上调用 validate() 时:
$("#your_form").validate();
In my case, I had no form with the id "your_form" on my page hence causing this error when trying to add rules.
就我而言,我的页面上没有 id 为“your_form”的表单,因此在尝试添加规则时导致此错误。
回答by Dmitry Zaets
Looks like your projects use different types of validadion (One of them use unobtrusive and second use default).
看起来您的项目使用不同类型的验证(其中一个使用不显眼,第二个使用默认值)。
Please check if you are using next settings in web.config's of both projects.:
请检查您是否在两个项目的 web.config 中使用下一个设置。:
<configuration>
<appSettings>
<add key="ClientValidationEnabled" value="true"/>
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>
</appSettings>
</configuration>
Also you are trying to work with first form in your document.
此外,您正在尝试使用文档中的第一个表单。
In case when there is no forms - you will get error.
如果没有表格 - 你会得到错误。
In case when there are more then one form - only first form will use focusoutfor validation.
在情况下,当有更多的再一种形式-只有第一种形式将使用事件的内容进行验证。
So you should do same thing for each form:
所以你应该对每个表单做同样的事情:
$(document).ready(function () {
var $forms = $('form');
$.each($forms, function (key, value) {
// enable validation when an input loses focus.
var settings = $.data(value, 'validator').settings;
settings.onfocusout = function (element) { $(element).valid(); };
});
});
回答by faisal py
Doing this $.validator.unobtrusive.parse($("#base-modal form"));
resolved my issue
这样做$.validator.unobtrusive.parse($("#base-modal form"));
解决了我的问题
回答by iamawebgeek
Checkout number of forms first, I think you are using incorrect form.
首先结帐表格数量,我认为您使用的表格不正确。
$(document).ready(function () {
// enable validation when an input loses focus.
if($('form').length > 0) {
// $('form')[0] is it proper form?
var settngs = $.data($('form')[0], 'validator').settings;
settngs.onfocusout = function (element) { $(element).valid(); };
}
});