Menu
I've started to use the jQuery validate plugin. I was having a few issues with the display of the error messages and wanted to create a test page where I could experiment with a few things. Despite the same setup working for me yesterday, I'm now getting the follwing message:
this[0] is undefined
looking at the jQuery code, it fails in the following section (specific line highlighted):
valid: function() {
if ( $(this[0]).is('form')) {
return this.validate().form();
} else {
var valid = true;
**var validator = $(this[0].form).validate();**
this.each(function() {
valid &= validator.element(this);
});
return valid;
}
}
from looking at it, it must think that my validator isn't a form, but it is. Don't really understand what's going on. The code only fails when try to print out the result of the valid() method to the console. Here's my code so far. Grateful for any help.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
th {
text-align: center;
}
.labelCol {
width: 60px;
}
</style>
<script type="text/javascript" src="jquery-1.6.1.full.js"></script>
<script type="text/javascript" src="jquery.validate.full.js"></script>
<script type="text/javascript">
$('#myform').validate({
rules: {
thisval: "required"
}
});
console.info($('#myform').valid());
</script>
</head>
<body>
<form id="myform" name="myform" action="" method="post">
<table>
<tr>
<th colspan="2">Header Section</th>
</tr>
<tr>
<td class="labelCol">This Title</td>
<td class="valueCol">
<input type="text" name="thisval" id="thisval"
maxlength="45" size="45" />
</td>
</tr>
<tr>
<td>
<input type="submit" value="submit" />
</td>
</tr>
</table>
</form>
</body>
</html>
230
Your #myform form is not loaded when the script is executed, so $('#myform') doesn't match anything. Wrap your script in a ready event handler.
<script type="text/javascript">
$(function() { // <-- add this
$('#myform').validate({
rules: {
thisval: "required"
}
});
console.info($('#myform').valid());
});
</script>
Wrap your code in a document ready function such as:
$(function()
{
$('#myform').validate({
rules: {
thisval: "required"
}
});
console.info($('#myform').valid());
});
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;
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
