Download the below code....
https://docs.google.com/file/d/0B_lKxr7C6K3zRHBPWmhHVFUzT1E/edit?usp=sharing
or
<html>
<head>
<title>JQuery Form Validation</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript"
src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#form1").validate({
debug: false,
rules: {
name: "required",
dropdown: "required",
email: {
required: true,
email: true
}
},
messages: {
name: "Please enter your good name.",
email: "Please enter your valid email address.",
dropdown: "Please select option from dropdown list.",
},
submitHandler: function(form) {
$.post('nextstep.php', $("#form1").serialize(), function(data) {
$('#result').html(data);
});
}
});
});
</script>
<style>
label.error { width: 250px; display: inline; color: red;}
</style>
</head>
<body>
<form name="form1" id="form1" action="" method="POST">
<label for="name" id="name_label">Name</label>
<input type="text" name="name" id="name" size="30" value=""/>
<br>
<label for="email" id="email_label">Email</label>
<input type="text" name="email" id="email" size="30" value=""/>
<br>
Please Select the City:
<select name="dropdown" id="dropdown">
<option value="">None</option>
<option value="mumbai">Mumbai</option>
<option value="delhi">Delhi</option>
<option value="pune">Pune</option>
</select>
<br>
<input type="submit" name="submit" value="Submit">
</form>
<!-- We will output the results from process.php here -->
<div id="result"><div>
</body>
</html>
or
http://www.webreference.com/programming/javascript/jquery/form_validation/index.html
http://www.tutorialswitch.com/web-development/quick-and-simple-ajax-forms-with-json-responses/
