I have checkbox and a text follows it, like;
[checkbox] I agree
If the checkbox is not clicked when submitting, the current way of showing the error msg I have is(I use errorElement:"div");
[checkbox]
This field is required.
I agree**
I would rather like;
[checkbox] I agree
This field is required
Any idea how to get this done?.
The html wrap for the concerned checkbox and text elements I have is like this;
[div] [checkbox] I agree [/div] [div][/div]
I tried errorPlacment: as follows hoping to apply it just for that element alone;
...
messages: {
usage_terms: {
required: "Must agree to Terms of Use.",
//errorElement: "div"
errorPlacement: function(error, element) {
error.appendTo( element.parent("div").next("div") );
}
}
}
...
It didn't work. Any idea?.
errorPlacement
isn't underneath messages (as an option), it's a global option, so instead it should look like this:
messages: {
usage_terms: "Must agree to Terms of Use."
}
errorPlacement: function(error, element) {
if(element.attr("name") == "usage_terms") {
error.appendTo( element.parent("div").next("div") );
} else {
error.insertAfter(element);
}
}
Here's we're just checking the element name when deciding where it goes, you could do another check though, for example giving all the ones that behave like this a class, and doing element.hasClass("placeAfter")
.