JQuery Validation - Wrap offending field in a div.
Posted
by Samuurai
on Stack Overflow
See other posts from Stack Overflow
or by Samuurai
Published on 2009-10-01T09:41:05Z
Indexed on
2010/03/26
6:03 UTC
Read the original article
Hit count: 226
Hi, It's my first time using StackOverFlow and first time trying to set up jQuery Validation. It's displaying <label>
tags with the error messages as default behaviour, however the way my CSS is set up I need a div to wrap around the offending element and a message display in <p>
tags.
Without errors, my html looks like this:
<div class="grid-26 append-2">
<p class="noMarginBottom">
<label>First Name</label>
<div class="jNiceInputWrapper">
<div class="jNiceInputInner">
<input type="text" class="text jNiceInput" name="name"/>
</div>
</div>
</p>
<span class="clear"/>
</div>
And with Errors, it needs to look like this - Note the div with class "error" and the <p>
tag.
<div class="grid-26 append-2">
<div class="error">
<p>Please write your real name</p>
<p class="noMarginBottom">
<label>First Name</label>
<div class="jNiceInputWrapper">
<div class="jNiceInputInner">
<input type="text" class="text jNiceInput" name="name"/>
</div>
</div>
</p>
<span class="clear"/>
</div>
</div>
My Validation code is very basic.
$(document).ready(function(){
$("#contact_form").validate({
rules:{
name: {
required: true
}
}
});
});
This is my first venture into jQuery and form validation, so I'll be the first to say "I'm lost!" any help would be greatly appreciated. Thanks.
© Stack Overflow or respective owner