So I am trying to pass a file through Ajax along with other data in the form. Every data except the file is getting passed. I am sending an email with all the data using php. I am new to Ajax and tried many ways. But still not sure where I am going wrong.
So here is my jQuery code
$(document).ready(function(){
$("#submitbtn").click(function(){
var uname = $("#uname").val();
var uemail= $("#uemail").val();
var subject= $("#subject").val();
var resume= $('input[type=file]').val();
var message= $("#message").val();
if(uname == '')
{
$("#errormsgs1").html("Please Enter Name");
$("#uname").css("border","1px solid #f00");
$("#uname").focus();
return false;
}
if(uemail == '')
{
$("#errormsgs2").html("Please Enter Email");
$("#uemail").css("border","1px solid #f00");
$("#uemail").focus();
return false;
}
if(subject == '')
{
$("#errormsgs3").html("Please Enter Subject");
$("#subject").css("border","1px solid #f00");
$("#subject").focus();
return false;
}
if(resume == '')
{
$("#errormsgs4").html("Please Enter Your Resume");
$("#resume").css("border","1px solid #f00");
$("#resume").focus();
return false;
}
if(message == '')
{
$("#errormsgs5").html("Please Enter Message");
$("#message").css("border","1px solid #f00");
$("#message").focus();
return false;
}
$("form#data").submit(function(){
var formData = new FormData(this);
$.ajax({
url: mycareer.php,
type: 'POST',
data: formData,
async: false,
success: function (data) {
alert(data)
},
cache: false,
contentType: false,
processData: false
});
return false;
});
Below is the mycareer.php file
<?php
$uname = $_POST['uname'];
print_r($uname);
$uemail = $_POST['uemail'];
print_r($uemail);
//$subject = $_POST['subject'];
$resume = $_FILES['resume'];
print_r($resume );
$message = $_POST['message'];
print_r($message );
if($uname !='' && $uemail !='')
{
$to = 'sayantan.m@gmail.in';
$subject = "My Career";
$message ='<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<title>Mycareer.in</title>
<style type="text/css">
div, p, a, li, td {
-webkit-text-size-adjust:none;
}
.ReadMsgBody {
width: 100%;
background-color: #d1d1d1;
}
.ExternalClass {
width: 100%;
background-color: #d1d1d1;
line-height:100%;
}
body {
width: 100%;
height: 100%;
background-color: #d1d1d1;
margin:0;
padding:0;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust:100%;
}
html {
width: 100%;
}
img {
-ms-interpolation-mode:bicubic;
}
table[class=full] {
padding:0 !important;
border:none !important;
}
table td img[class=imgresponsive] {
width:100% !important;
height:auto !important;
display:block !important;
}
@media only screen and (max-width: 800px) {
body {
width:auto!important;
}
table[class=full] {
width:100%!important;
}
table[class=devicewidth] {
width:100% !important;
padding-left:20px !important;
padding-right: 20px!important;
}
table td img.responsiveimg {
width:100% !important;
height:auto !important;
display:block !important;
}
}
@media only screen and (max-width: 640px) {
table[class=devicewidth] {
width:100% !important;
}
table[class=inner] {
width:100%!important;
text-align: center!important;
clear: both;
}
table td a[class=top-button] {
width:160px !important;
font-size:14px !important;
line-height:37px !important;
}
table td[class=readmore-button] {
text-align:center !important;
}
table td[class=readmore-button] a {
float:none !important;
display:inline-block !important;
}
.hide {
display:none !important;
}
table td[class=smallfont] {
border:none !important;
font-size:26px !important;
}
table td[class=sidespace] {
width:10px !important;
}
}
@media only screen and (max-width: 520px) {
}
@media only screen and (max-width: 480px) {
table {
border-collapse: collapse;
}
table td[class=template-img] img {
width:100% !important;
display:block !important;
}
}
@media only screen and (max-width: 320px) {
}
</style>
</head>
<body style="background:#f2f2f2;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="full">
<tr>
<td height="54"> </td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="full">
<tr>
<td align="center"><table width="600" border="0" cellspacing="0" cellpadding="0" align="center" class="devicewidth">
<tr>
<td><table width="100%" bgcolor="#ffffff" border="0" cellspacing="0" cellpadding="0" align="center" class="full" style="border-radius:5px 5px 0 0; background-color:#ffffff;">
<tr>
<td height="29"> </td>
</tr>
<tr>
<td><table border="0" cellspacing="0" cellpadding="0" align="left" class="inner" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td width="23" class="hide"> </td>
<td height="75" class="inner" valign="middle"><a href="#"><img class="logo" src="http://my.in/img/my-logo.png" width="180" height="61" alt="Logo" style="background: #000;padding: 10px;"></a></td>
</tr>
</table>
<table width="150" border="0" cellspacing="0" cellpadding="0" align="right" class="inner" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td height="15"> </td>
</tr>
<tr>
<td align="center"><a href="http://my.in/" class="top-button" style="font:bold 13px/37px Arial, Helvetica, sans-serif; color:#ffffff; text-decoration:none; background:#f47920; display:block; border-radius:24px; text-transform:uppercase;">View online</a></td>
<td class="hide" width="20"> </td>
</tr>
</table></td>
</tr>
<tr>
<td style="border-bottom:1px solid #dbdbdb;"> </td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="full">
<tr>
<td align="center"><table width="600" border="0" cellspacing="0" cellpadding="0" align="center" class="devicewidth">
<tr>
<td><table width="100%" bgcolor="#ffffff" border="0" cellspacing="0" cellpadding="0" align="center" class="full" style="background-color:#ffffff;">
<tr>
<td height="23"> </td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="23" class="sidespace"> </td>
<td><table width="76%" border="0" cellspacing="0" cellpadding="0" align="left" class="inner" id="banner" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<!--<tr>
<td style="font:bold 20px Arial, Helvetica, sans-serif; border-right:1px solid #dbdbdb;color: #000;" class="smallfont">THE BEST NUTRITION PLANS ARE HERE</td>
</tr>-->
<tr>
<td height="20"> </td>
</tr>
</table>
<!--<table width="22%" border="0" cellspacing="0" cellpadding="0" align="right" class="inner" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td align="center"><a href="https://www.facebook.com/quanutrition.bangalore?fref=ts" style="margin-top:5px; display:inline-block;"><img src="http://www.quanutrition.com/images/facebook.png" width="32" height="atuo" alt="Social Media" /></a></td>
<td align="center"><a href="https://twitter.com/Qua_Nutrition?lang=en" style="margin-top:5px; display:inline-block;"><img src="http://www.quanutrition.com/images/twitter.png" width="32" height="atuo" alt="Social Media" /></a></td>
<td align="center"><a href="https://plus.google.com/+quanutritionbestdietplans" style="margin-top:5px; display:inline-block;"><img src="http://www.quanutrition.com/images/google.png" width="32" height="atuo" alt="Social Media" /></a></td>
</tr>
<tr>
<td height="20"> </td>
<td height="20"> </td>
<td height="20"> </td>
</tr>
</table>--></td>
<td width="23" class="sidespace"> </td>
</tr>
</table>
<!--<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="3.33%" class="sidespace"> </td>
<td width="93.33%"><img class="imgresponsive" src="http://www.quanutrition.com/images/banner1.jpg" width="554" height="atuo" alt="Banner" /></td>
<td width="3.33%" class="sidespace"> </td>
</tr>
<tr>
<td height="20"> </td>
<td height="20"> </td>
<td height="20"> </td>
</tr>
</table>-->
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="23" class="sidespace"> </td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" align="left" class="inner">
<tr>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;width: 20%;color: #000;" class="smallfont">Name </td>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont" width="23">'.$uname.'</td>
</tr>
<tr>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont">Email </td>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont" width="23">'.$uemail.'</td>
</tr>
<tr>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont">Mobile </td>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont" width="23">'.$resume.'</td>
</tr>
<tr>
<tr>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont">Message:</td>
<td style="font:15px/19px Arial, Helvetica, sans-serif;padding-bottom: 8px;color: #000;" class="smallfont" width="23">'.$message.'</td>
</tr>
<tr>
<td height="20"> </td>
<td class="hide" height="20"> </td>
</tr>
</table>
</td>
<td width="23" class="sidespace"> </td>
</tr>
<tr>
<td height="16"> </td>
<td height="16"> </td>
<td height="16"> </td>
</tr>
</table></td>
</tr>
<tr>
<td style="border-bottom:1px solid #dbdbdb;"> </td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="full">
<tr>
<td align="center"><table width="600" border="0" cellspacing="0" cellpadding="0" align="center" class="devicewidth">
<tr>
<td><table width="100%" bgcolor="#ffffff" border="0" cellspacing="0" cellpadding="0" align="center" class="full" style="border-radius:0 0 7px 7px;">
<tr>
<td height="18"> </td>
</tr>
<tr>
<td><table class="inner" align="right" width="340" border="0" cellspacing="0" cellpadding="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; text-align:center;">
<tr>
<td width="21"> </td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="full">
<tr>
<td height="18"> </td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table class="inner" align="left" width="230" border="0" cellspacing="0" cellpadding="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; text-align:center;">
<tr>
<td width="21"> </td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" style="font:11px Helvetica, Arial, sans-serif; color:#000000;">© 2017, All rights reserved </td>
</tr>
<tr>
<td height="18"> </td>
</tr>
</table></td>
<td width="21"> </td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td height="20"> </td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>';
$headers = "MIME-Version: 1.0" . "
";
$headers .= "Content-type:text/html;charset=UTF-8" . "
";
$headers .= 'From: mail@my.in' . "
";
$headers .= 'Reply-to: '.$uemail.'' . "
";
//$headers .= 'Cc: rajendra.b@my.in' . "
";
$sent = mail($to,$subject,$message,$headers);
echo "Thankyou for Contacting with us. We will get back you soon !!.";
}
else
{
echo "Please enter all the fields.";
}
?>
Below is the form
<form action="purpledotcareer.php" id="fileUploadForm" method="post" enctype="multipart/form-data" onsubmit="return checkvalidate()">
<div class="form-group">
<label for="email">Enter Your Name:</label>
<input type="text" class="form-control" id="uname" name="uname" onblur="if (this.value == '') {this.value = '';}" onfocus="this.value = '';" required="" type="text" value="" >
</div>
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" id="uemail" name="uemail" onblur="if (this.value == '') {this.value = '';}" onfocus="this.value = '';" required="" type="text" value="" >
</div>
<div class="form-group">
<label for="email">Message:</label>
<textarea class="form-control" id="message" name="message" onblur="if (this.value == '') {this.value = '';}" onfocus="this.value = '';" required="" rows="3" ></textarea>
</div>
<div class="form-group">
<label for="email">Upload Resume:</label>
<input type="file" class="form-control" id="resume" name="resume" onblur="if (this.value == '') {this.value = '';}" onfocus="this.value = '';" required="" accept=".xlsx,.xls,.doc, .docx,.ppt, .pptx,.txt,.pdf" >
</div>
<button type="submit" id="btnSubmit" class="btn btn-default">Submit</button>
</form>
It will be really helpful if anybody can solve this. Thanks in advance
