Contact form with attachment using html, javascript, jquery and php

A simple contact form to send email with attachment.

sendEmail.html

<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' type='text/css' href='sendEmail.css'/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script type='text/javascript' src='validateEmail.js'></script>
</head>
<body>
	<form name="contactform" class="contactform" method="post" onsubmit="return validateForm()"  action="sendEmail.php">
		<label>Sender Email:</label>
		<input type="text" id="semail" name="semail" />
		<label>Recipient Email:</label>
		<input type="text" id="remail" name="remail" value="" />
		<label for="Subject">Subject:</label>
		<input type="text" name="Subject" id="Subject" />
		<label for="Attachment">Attachment:</label>
		<input type="file" name="attach1" id="attach1" />
		<label for="Message">Message:</label><br />
		<textarea name="Message" rows="20" cols="20" id="Message"></textarea>
    	<div class="submit-btn">
    	<input type="submit"/>
    	</div>
	</form>
</body>
</html>

sendEmail.css

.contactform
{
    font-family: Verdana, Arial, sans-serif;
    width:550px;
}
.contactform label
{
    float: left;
	text-align: right;
	margin-right: 15px;
	width: 200px;
	padding-top: 5px;
}
.contactform input{
    width:300px;
    padding: 5px;
	font-family: Helvetica, sans-serif;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
}
.contactform textarea {
	vertical-align: bottom;
	width: 310px;
	height:150px;
	color: #777;
}
.submit-btn input
{
    width:50px;
    float: left;
	text-align: right;
	margin-left: 480px;
	padding-top: 5px;
}

validateEmail.js

function validateForm()
{
	var validation = true;
   if(!validateEmail(document.contactform.semail.value))
   {
     alert( "invalide sender email!" );
     $("#semail").css("border-color", "red");
     validation=false;
   }
   if(!validateEmail(document.contactform.remail.value))
   {
     alert( "invalide recipient email" );
     $("#remail").css("border-color", "red");
     validation=false;
   }
   return validation;
}
function validateEmail(email) { 
    var re = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
    return re.test(email);
}

sendEmail.php

<?php
ini_set('display_errors', 1);
$senderEmail = filterInput($_POST['semail']);
$recipientEmail = filterInput($_POST['remail']); 
$message = filterInput($_POST['Message']);
$subject = filterInput($_POST['Subject']);

echo $senderEmail.$recipientEmail.$message.$subject;
if(sendEmailWithAttachments($recipientEmail,$senderEmail,$subject,$message))
{
	echo "Email sent successfully!";
}
else
{
	echo "Failed to send the email...";
}

function filterInput($data)
{
     $data = trim($data);
     $data = stripslashes($data);
     $data = htmlspecialchars($data);
     return $data;
}
function sendEmailWithAttachments($recipientEmail,$senderEmail,$subject,$message){

	
    if(isset($_FILES)) {
echo "iamhere";
        $allowedExtensions = array("pdf","doc","docx","gif","jpeg","jpg","JPG","png","PNG","rtf","txt","xml");

        $files = array();
        foreach($_FILES as $name=>$file) {
            //die("file size: ".$file['size']);
            if($file['size']>=5242880)//5mb
            {
                $fileSize=$file['size'];
                return false;
            }
            $file_name = $file['name']; 
            $temp_name = $file['tmp_name'];
            $file_type = $file['type'];
            $path_parts = pathinfo($file_name);
            $ext = $path_parts['extension'];
            if(!in_array($ext,$allowedExtensions)) {
                return false;
                die("File $file_name has the extensions $ext which is not allowed");
            }

            //move the file to the server, cannot be skipped
            $server_file="/tmp/$path_parts[basename]";
            move_uploaded_file($temp_name,$server_file);
            array_push($files,$server_file);
            //array_push($files,$temp_name);
        }

        // email fields
        $headers = "From: $senderEmail";


        // boundary 
        $semi_rand = md5(time()); 
        $mime_boundary = "==Multipart_Boundary_x{$semi_rand}x"; 

        // headers for attachment 
        $headers .= "\nMIME-Version: 1.0\n" . "Content-Type: multipart/mixed;\n" . " boundary=\"{$mime_boundary}\""; 

        // multipart boundary 
        $message = "This is a multi-part message in MIME format.\n\n" . "--{$mime_boundary}\n" . "Content-Type: text/plain; charset=\"iso-8859-1\"\n" . "Content-Transfer-Encoding: 7bit\n\n" . $message . "\n\n"; 
        $message .= "--{$mime_boundary}\n";

        // preparing attachments
        for($x=0;$x<count($files);$x++){
            $file = fopen($files[$x],"rb");
            $data = fread($file,filesize($files[$x]));
            fclose($file);
            $data = chunk_split(base64_encode($data));
            $message .= "Content-Type: {\"application/octet-stream\"};\n" . " name=\"$files[$x]\"\n" . 
            "Content-Disposition: attachment;\n" . " filename=\"$files[$x]\"\n" . 
            "Content-Transfer-Encoding: base64\n\n" . $data . "\n\n";
            $message .= "--{$mime_boundary}\n";
        }

        // send
        return @mail($recipientEmail, $subject, $message, $headers);

    }
}   

Search within Codexpedia

Custom Search

Search the entire web

Custom Search