Tuesday, 13 August 2013

form validation in jquery without using plugin

form validation in jquery without using plugin

I want to validate a simple form using jquery before sending data to the
saver. Here I need to display error messages in a alert box. I can't use
any jquery plugin to use validation process.
This is my HTML form -
<form action="" method="post" class="a">
Name : <input type="text" class="text" name="name" id="name" /> <br/>
Address : <input type="text" class="text" name="address" id="address"
/> <br/>
Email: <input type="text" class="text" name="email" id="email" /> <br/>
<input type="button" id="submit" value="Submit" name="submit" />
</form>
If a user submit this form without filling any form element then I need to
display 3 error messages in single alert box. Like this
Name can not be empty.
Address can not be empty.
email can not be empty.
If only one or two field remain empty, then I need to control error
message according the situation.
Here I tried it using jquery. But alert box display one by one.
My jQuery -
$('#submit').on('click', function() {
valid = true;
if ($('#name').val() == '') {
alert ("please enter your name");
valid = false;
}
if ($('#address').val() == '') {
alert ("please enter your address");
valid = false;
}
});
This is FIDDEL
Can any body tell me how can I figure this out? Thank you.

No comments:

Post a Comment