William Jiang

JavaScript,PHP,Node,Perl,LAMP Web Developer – http://williamjxj.com; https://github.com/williamjxj?tab=repositories

PHP and jQuery: send email

I wrote a very compact, simple web app: send email via a web page.
The functions use PHP and jQuery(version 1.5.1), include:

  • form validation
    I use a excellent jQuery plugin: Validation Engine to do the form validation.
  • Ajax Style send email
    use jQuery’s $.ajax(), and ‘click’ event to send email instead of form submit.

(1) the header part: to launch all the need js and css file.

<script language="javascript" type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.validationEngine-en.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.validationEngine.js"></script>
<link rel="stylesheet" type="text/css" href="css/validationEngine.jquery.css" />

(2) form and its javascript action:

<form id="request_form" method="post" action="<?=$_SERVER['PHP_SELF'];?>">
  <p>Organization:</p>
  <div class="inputbg">
    <input id="organization" name="organization" type="text"  class="input validate[required]" onFocus="this.select();" />
  </div>
  <p>Name:</p>
  <div class="inputbg">
    <input id="name" name="name" class="input validate[required]" type="text" onFocus="this.select();" />
  </div>
  <p>Email:</p>
  <div class="inputbg">
    <input id="email" name="email" type="text" class="input validate[required,custom[email]]" onFocus="this.select();" />
  </div>
  <p>Phone #:</p>
  <div class="inputbg">
    <input id="phone" name="phone" class="input validate[required,custom[telephone]]" type="text" onFocus="this.select();" />
  </div>
  <input id="request_submit" value="Send Request" type="submit">
</form>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
  $("#request_submit").click( function(event) {
	$("#request_form").validationEngine();
	event.preventDefault();
	if ($("#request_form").validationEngine({returnIsValid:true})) {
		alert( $("#request_form").serialize());
		$.ajax({
			type: $("#request_form").attr('method'),
			url: $("#request_form").attr('action'),
			data: $("#request_form").serialize(),
			success: function(data) {
				alert(data);
				$("#request_form").append('<p>Successfully send out this email request!</p>');
			}
		});
	}			
  });
});
</script>

(3) PHP process:

<?php

if(isset($_POST['email'])) {
	if ( !check_email( trim($_POST['email']) )) {
		echo 'Please enter a valid email address<br />';
	}
	else send_email();
}
exit;
function check_email($emailAddress) {
	if (preg_match('/\b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b/i', $emailAddress)){
		$emailArray = explode("@",$emailAddress);
		if (checkdnsrr($emailArray[1])){
			return true;
		}
	}
	return false;
}
function send_email() {
	$message = "\nOrganization: " . $_POST['organization'] . 
		"\nName: " . $_POST['name'] .
		"\nEmail: " . $_POST['email'] .
		"\nPhone: " . $_POST['phone'];
	
	$message .= "\n\nBrowser Info: " . $_SERVER["HTTP_USER_AGENT"] .
		"\nIP: " . $_SERVER["REMOTE_ADDR"] .
		"\n\nDate: " . date("Y-m-d h:i:s");

	$siteEmail = 'test@test.com';
	$emailTitle = 'Request from examples.com';
	$thankYouMessage = "Thank you for contacting us, we'll get back to you shortly.";   

	if(! mail($siteEmail, $emailTitle, $message, 'From: ' . $_POST['name'] . ' <' . $_POST['email'] . '>'))
		echo 'Mail can not sent.';
}
?>

It works pretty cool.

Advertisements

3 responses to “PHP and jQuery: send email

  1. vagnok 10/26/2011 at 12:24 pm

    Hello

    It doesn’t work to me, can you send an example file?

    Thx

    • williamjxj 10/26/2011 at 2:08 pm

      1. first, make sure the Linux command ‘mail’ works ($ type mail or: $ which mail to make it path is available).

      2. has your smtp server setup ok?

      I will send you the codes later when I got time. the benefits to use it are: form validation, simple, and ajax.

    • williamjxj 10/26/2011 at 2:45 pm

      I created the ‘send email sample’ which is available from here:

      http://williamjxj.com/archive/send_email.zip

      1. it includes all the necessary files together, so directly runs send_email.php, it would work.

      2. before that, change the receiving email address which refers to you on send_email.php.

      3. that’s it.
      By the way, if you want to make your form looks better, add jqtransform.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: