jQuery 验证插件错误：TypeError: 验证器未定义
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12407312/
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 plugin error: TypeError: validator is undefined
提问by Damir Mitrovic
Here is html code for the form:
这是表单的html代码：
<form method="post" id="login" action="/login">
<div class="login-element">
<label for="email">E-Mail</label>
<input type="text" name="email">
</div>
<div class="login-element">
<label for="password">Passwort</label>
<input type="password" name="password">
</div>
<div class="login-element">
<input type="submit" value="Login">
</div>
</form>
and here is the code that I used for validation:
这是我用于验证的代码：
$(document).ready(function() {
$("#login").validate({
debug: true,
rules: {
email: {
required: true,
email: true
},
password: {
required: true
}
},
messages: {
email: {
required: "Please enter a email adress",
email: "Please enter a valid email address"
},
password:"Please enter password"
}
});
});
In the console following error is logged:
在控制台中记录以下错误：
TypeError: validator is undefined
...or.settings[eventType] && validator.settings[eventType].call(validator, this[0],...
What could be the issue here?
这里可能是什么问题？
回答by Damir Mitrovic
This error happened because I had another html element with same id. After removing that id code worked fine.
发生此错误是因为我有另一个具有相同 ID 的 html 元素。删除该 ID 代码后工作正常。
回答by Pratik
For anyone still looking for an answer and the answers above dont work..
对于任何仍在寻找答案的人来说，上面的答案都不起作用..
I spent the last 3 hours trying all the solution and none of them worked.
我花了最后 3 个小时尝试所有解决方案，但没有一个奏效。
I finally realized a very stupid mistake , I had initialized Jquery twice in my application
我终于意识到一个非常愚蠢的错误，我在我的应用程序中初始化了两次 Jquery
once in the head where i had included 3 scripts
曾经在我的脑海中包含了 3 个脚本
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
and once again at the end of the page where i only had the line.
再次在我只有一行的页面末尾。
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
This was resetting the validator function of $ and causing everything to break.
这是重置 $ 的验证器功能并导致一切中断。
Some things to check for cases where validations are not firing.
检查未触发验证的情况的一些事项。
Is the script in correct order ? jquery followed by validate followed by unobstrusive.
Is the $.validator function defined ? Check quickly in the console of the browser
Is the form to be validated being created dynamically ? If so , you may need to re initialize the validator plugin on the form , the best way i have found of doing this are mentioned below , choose the one which fits well for you.
$.validator.unobstrusive.parse('#myForm')
脚本的顺序是否正确？jquery 其次是验证，然后是不引人注目的。
是否定义了 $.validator 函数？在浏览器的控制台中快速查看
要验证的表单是动态创建的吗？如果是这样，您可能需要重新初始化表单上的验证器插件，下面提到了我发现的最佳方法，选择最适合您的方法。
$.validator.unobstrusive.parse('#myForm')
or
或者
$('#myForm').validate() // this just makes the validator plugin consider the form for unobstrusive validation
or
或者
$('#myForm').valid() // this will trigger unobstrusive validation on the form.
- If you have complicated ajax loads for many forms , make sure that the scripts are not included again and again in each ajax page , also make sure that elements on the main page still have unique names.
- 如果您有多种表单的复杂ajax 加载，请确保脚本不会一次又一次地包含在每个ajax 页面中，还要确保主页上的元素仍然具有唯一的名称。
Hope this helps.
希望这可以帮助。
回答by Andrew Walters
You need to include the validation script in the head of your document.
您需要在文档的头部包含验证脚本。
Like this:
像这样：
<script src="/js/libs/jquery.validate.js" type="text/javascript"></script>
Also, please check in the rendered HTML that your form ID is correct.
另外，请检查您的表单 ID 是否正确呈现的 HTML。
I use this code for calling validate on my sites
我使用此代码在我的网站上调用验证
//Validate Form
var ids = [];
$("form").each(function () {
ids.push(this.id);
});
var formId = "#" + ids[0]
$(formId).validate();
回答by Marcin Bigoraj
Because this is the first topic that Google shows for "validator is undefined" then I will describe my solved problem, maybe someone will find it helpfull.
因为这是谷歌为“验证器未定义”显示的第一个主题，所以我将描述我解决的问题，也许有人会发现它有帮助。
I was using 'maxlength' attribute (nothing fancy) and I got this error. The reason was nested forms. One of the textarea was inside both forms. Can happen when you have modals (dialogs) with forms in main view.
我正在使用 'maxlength' 属性（没什么特别的），但我收到了这个错误。原因是嵌套表单。textarea 之一在两种形式中。当您在主视图中有带有表单的模态（对话框）时可能会发生这种情况。
回答by MaVRoSCy
The same issue showed up for me. The reason for that error what that I was using the code:
同样的问题出现在我身上。该错误的原因是我使用的代码：
if ($("#invalidFormId").valid()) {
....
}
And the idof the formelement was not valid
而id在的form元素无效
回答by Xemadk
In my case the problem came that had two instanced versions of Jquery UI i JQuery. This made that Jquery normal code works fine but delete the intance of $.validator.
在我的情况下，问题出现了两个实例化版本的 Jquery UI i JQuery。这使得 Jquery 正常代码工作正常，但删除了 $.validator 的实例。
回答by Sreejith K.
In my case the error was because the validator was being called too early. I moved the code to a seperate function and called it using delay method of underscore.js. Worked like a charm.
在我的情况下，错误是因为验证器被调用得太早了。我将代码移到一个单独的函数中，并使用 underscore.js 的延迟方法调用它。像魅力一样工作。
_.delay(doValidations);
function doValidations() {
...
});
回答by StackExchanger
I had @Scripts.Render("~/bundles/jquery")in the parent view (_Layout.cshtml) and had also defined some other jquery Script tags in another view, they clashed.
我@Scripts.Render("~/bundles/jquery")在父视图 (_Layout.cshtml) 中并且还在另一个视图中定义了一些其他 jquery Script 标签，它们发生了冲突。
回答by mariofertc
The plugin comes in separate libraries, you need to include those in your html.
该插件来自单独的库，您需要将它们包含在您的 html 中。
<script src="../jquery-validation/dist/jquery-validate.min.js"></script>
<script src="../jquery-validation/dist/additional-methods.min.js"></script>
回答by Rust
Same happened here. For me it was a typo in my code:
这里也发生了同样的事情。对我来说，这是我的代码中的一个错字：
$(document).ready(function(){
//START of validate
$('#reply').validate({
rules:{
message:{
required: true,
},
},
submitHandler: function(form) {
var data = $("#reply").serialize();
$.ajax({
type:"POST",
url:"ajax/scripts/msg_crt.php",
data:data,
success:function(data){
alert("Loaded");
}
});
}
});
//END of validate
});
$(document).on('click','#send', function(){
if($('#replay').valid()){// <--- Here is my selector typo
$("#replay").submit(); // <--- Here is my selector typo
}
return false;
});
