<!DOCTYPE html>
<html>
<head>
<title>jQuery post form data using .post() method by codeofaninja.com</title>
<style>
div {
margin: 15px;
}
</style>
</head>
<body>
<h1>jQuery post form data using .post() method</h1>
<div>Filling out and submitting the form below to receive a response.</div>
<!-- our form -->
<form id="userForm" action="/form/submit" method="post">
<div>
<input type="text" name="firstname" placeholder="Firstname" />
</div>
<div>
<input type="text" name="lastname" placeholder="Lastname" />
</div>
<div>
<input type="email" name="email" placeholder="Email" />
</div>
<div>
<input type="submit" value="Submit" />
</div>
</form>
<!-- where the response will be shown -->
<div id="response"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "></script>
<script>
$(document).ready(function() {
$('#userForm').submit(function() {
// showing that something is loading
$('#response').html("<b>Loading response...</b>");