Testing
HTML
<form id="form" action="submit.php" method="post" name="form">
<p>contact us</p>
<p><label for="">Name</label><input id="name" name="name" type="text" /></p>
<p><label for="">Email</label><input id="email" name="email" type="email" /></p>
<p><label for="">Phone Number</label><input id="phone" name="phone" type="tel" /></p>
<p><label for="">Message Number</label><input id="message" name="message" type="text" /></p>
<input type="submit" value="Submit">
</form>
JavaScript
$(function(){
$('#form').submit(function(e){
$("#form").validate({
debug: false,
rules: {
name: "required",
email: {
required: true,
email: true
},
phone: {
equired: true,
phone: true
}
},
messages: {
name: "Please let us know who you are.",
email: "A valid email will help us get in touch with you.",
phone: "Please provide a valid phone number.",
},
submitHandler: function() {
// Stop the form actually posting
e.preventDefault();
// Send the request
$.post('/submit.php', {
name: $('#name').val(),
email: $('#email').val(),
phone: $('#phone').val(),
message: $('#message').val()
}, function(d){
alert("Thank you for submitting your request someone will contact your shortly.");
});
}
});
});
});