/gist:8316258

## gistfile1.html
<?php

$mail_sent = false;
$success_msg = 'Thanks for the comment dude!';

if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
    $errors = array();

    $name = filter_var($_POST['name'], FILTER_SANITIZE_STRING);
    $email_address = filter_var($_POST['email_address'], FILTER_VALIDATE_EMAIL);
    $comment = filter_var($_POST['comment'], FILTER_SANITIZE_STRING);

    if (!$name) $errors['name'] = 'Please enter your name.';
    if (!$email_address) $errors['email_address'] = 'Please enter a valid email address.';
    if (!$comment) $errors['comment'] = 'Please enter a comment.';

    if (empty($errors))
    {
        $body = "Name: {$name}\n\n";
        $body = wordwrap($body, 70);

        $mail_sent = mail('simon@whatever.com', 'Contact Form Submission', $body, "From: {$email_address}");

        if (!$mail_sent) $errors['server'] = 'There was an error sending the email';
    }
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>test form</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
    <style type="text/css">
        span.error {
          background:url("images/unchecked.gif") no-repeat 0px 0px;
          padding-left: 16px;
        }
        span.success {
          background:url("images/checked.gif") no-repeat 0px 0px;
          padding-left: 16px;
        }
    </style>
</head>
<body>
    <div id="container">
        <?php if ($mail_sent): ?><p><em><?php echo $success_msg ?></em></p><?php endif ?>
        <form id="myform" name="contact" action="" method="post">
            <p>Name:
            <?php if (isset($errors['name'])): ?>
                <span class="error name"><?php echo $errors['name']; ?></span>
            <?php endif ?>
            </p>
            <input type="text" id="name" name="name"  value="<?php if (isset($name)) echo $name; ?>" />
            <p>Email address:
            <?php if (isset($errors['email_address'])): ?>
                <span class="error email_address"><?php echo $errors['email_address'];?></span>
            <?php endif ?>
            </p>
            <input type="text" name="email_address"  value="<?php if (isset($email_address)) echo $email_address; ?>" />
            <p>Add a comment:
            <?php if (isset($errors['comment'])): ?>
                <span class="error comment"><?php echo $errors['comment']; ?></span>
            <?php endif ?>
            </p>
            <textarea id="text_area" rows="11" cols="72" name="comment"></textarea>
            <input type="submit" name="send" id="send_button" value="Send">
        </form>
    </div>

    <script type="text/javascript">
        (function() {
            $("#myform").validate({
                errorElement: "span",
                errorPlacement: function(error, element) {
                    error.insertAfter( element );
                },
                success: function(label) {
                    label.text("ok!").addClass("success");
                },
                submitHandler: submitForm,
                rules: {
                    name: {
                        required:true
                    },
                    email_address: {
                        required:true,
                        email: true
                    },
                    comment: {
                        required:true
                    }
                }
            });

            function submitForm(form) {
                $.ajax({
                    type: "POST",
                    url: "contact-us.php",
                    data: $(form).serialize(),
                    success: function(message) {
                        $(form).replaceWith('<p><em>'+message+'</em></p>');
                    }
                });
            };
        })();
    </script>
</body>
</html>
	<?php

	$mail_sent = false;
	$success_msg = 'Thanks for the comment dude!';

	if ($_SERVER['REQUEST_METHOD'] == 'POST')
	{
	$errors = array();

	$name = filter_var($_POST['name'], FILTER_SANITIZE_STRING);
	$email_address = filter_var($_POST['email_address'], FILTER_VALIDATE_EMAIL);
	$comment = filter_var($_POST['comment'], FILTER_SANITIZE_STRING);

	if (!$name) $errors['name'] = 'Please enter your name.';
	if (!$email_address) $errors['email_address'] = 'Please enter a valid email address.';
	if (!$comment) $errors['comment'] = 'Please enter a comment.';

	if (empty($errors))
	{
	$body = "Name: {$name}\n\n";
	$body = wordwrap($body, 70);

	$mail_sent = mail('simon@whatever.com', 'Contact Form Submission', $body, "From: {$email_address}");

	if (!$mail_sent) $errors['server'] = 'There was an error sending the email';
	}
	}
	?>
	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>test form</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
	<style type="text/css">
	span.error {
	background:url("images/unchecked.gif") no-repeat 0px 0px;
	padding-left: 16px;
	}
	span.success {
	background:url("images/checked.gif") no-repeat 0px 0px;
	padding-left: 16px;
	}
	</style>
	</head>
	<body>
	<div id="container">
	<?php if ($mail_sent): ?><p><em><?php echo $success_msg ?></em></p><?php endif ?>
	<form id="myform" name="contact" action="" method="post">
	<p>Name:
	<?php if (isset($errors['name'])): ?>
	<span class="error name"><?php echo $errors['name']; ?></span>
	<?php endif ?>
	</p>
	<input type="text" id="name" name="name" value="<?php if (isset($name)) echo $name; ?>" />
	<p>Email address:
	<?php if (isset($errors['email_address'])): ?>
	<span class="error email_address"><?php echo $errors['email_address'];?></span>
	<?php endif ?>
	</p>
	<input type="text" name="email_address" value="<?php if (isset($email_address)) echo $email_address; ?>" />
	<p>Add a comment:
	<?php if (isset($errors['comment'])): ?>
	<span class="error comment"><?php echo $errors['comment']; ?></span>
	<?php endif ?>
	</p>
	<textarea id="text_area" rows="11" cols="72" name="comment"></textarea>
	<input type="submit" name="send" id="send_button" value="Send">
	</form>
	</div>

	<script type="text/javascript">
	(function() {
	$("#myform").validate({
	errorElement: "span",
	errorPlacement: function(error, element) {
	error.insertAfter( element );
	},
	success: function(label) {
	label.text("ok!").addClass("success");
	},
	submitHandler: submitForm,
	rules: {
	name: {
	required:true
	},
	email_address: {
	required:true,
	email: true
	},
	comment: {
	required:true
	}
	}
	});

	function submitForm(form) {
	$.ajax({
	type: "POST",
	url: "contact-us.php",
	data: $(form).serialize(),
	success: function(message) {
	$(form).replaceWith('<p><em>'+message+'</em></p>');
	}
	});
	};
	})();
	</script>
	</body>
	</html>