jquery validation error problem
I use this script daily and never had an issue before now. Ive been staring at it so long i can't find the issue. I have a form with an input, the input is required and has a minlength of 2. If you submit the form, it displays the "required" error message. If you enter one character and hit submit again, its adding another error message instead of changing between the two. Please help!This is using jquery.validate.js
<script type="text/javascript">
$(document).ready(function() {
$("#TTFirst").validate({
errorElement: "span",
errorPlacement: function(error, element) {
error.appendTo( element.parent("td"));
},
rules: {
license: {
required: true,
minlength: 2
}
开发者_StackOverflow中文版 },
messages: {
license: {
required: "Please Enter Your First Name",
minlength: "Must be at Least 2 Characters"
}
}
});
});
</script>
HTML
<table cellspacing="1" id="credits">
<form action="http://www.domain.com/dir/processor.php" method="post" id="TTFirst">
<table>
<tr class="odd">
<td width="500">
<label>$25 Transaction Credit for License </label>
<input type="text" name="license" />
</td>
<td width="50">$26.95</td>
<td width="150">
<input type="hidden" name="item_number" value="41">
<input type="submit" value="" class="orderNow" />
</td>
</tr>
</table>
</form>
Damdest thing ive ever seen. It works fine when put in a
<ul>
something with the table I guess.
Because you are using the custom errorPlacement, it looks like the technique for messages is performed by adding the message to the title attribute of the label in question, and not in the javascript. Check this example code.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script>
$(document).ready(function(){
$("#myform").validate({
errorPlacement: function(error, element) {
error.appendTo( element.parent("td").next("td") );
},
debug:true
})
});
</script>
</head>
<body>
<form id="myform" action="/login" method="post">
<table>
<tr>
<td><label>Firstname</label>
<td><input name="fname" class="required" value="Pete" /></td>
<td></td>
</tr>
<tr>
<td><label>Lastname</label></td>
<td><input name="lname" title="Your lastname, please!" class="required" /></td>
<td></td>
</tr>
<tr>
<td></td><td><input type="submit" value="Submit"/></td><td></td>
</table>
</form>
</body>
</html>
The error from the example only shows when the lname input is empty, and pulls from the title attribute.
加载中,请稍侯......
精彩评论