I have an form which is being validated using the Jquery Validate plugin. This form has a file input using which the user can upload his/her profile pic. Now , using the Validate plugin submit handler I am posting the entire form to a PHP file but the Server Script is not able to read $_FILE['my_id']
The Form:
<form id="faculty-add" class="form-horizontal" enctype="multipart/form-data" role="form">
<fieldset>
<!-- Other Fields -->
<div class="form-group">
<label for="facprof" class="col-sm-2 control-label">Profile Pic</label>
<div class="col-sm-9 col-sm-offset-1">
<input type="file" class="form-control input-large" id="facul_pic" name="facul_pic" accept="image/png" placeholder="Profile Image">
</div>
</div>
<!-- Other Fields -->
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Create Faculty Profile</button>
</div>
</div>
</fieldset>
</form>
THE JS:
$.validator.addMethod('filesize', function(value, element, param) {
// param = size (en bytes)
// element = element to validate (<input>)
// value = value of the element (file name)
return this.optional(element) || (element.files[0].size <= param);
});
$.fn.clearFormFields = function(area) {
$(area).find('input[type="text"],input[type="email"]').val('');
$(area).find('input[type="text"],input[type="email"]').removeClass('valid');
$(area).find('textarea').val('');
$(area).find('textarea').removeClass('valid');
$(area).find('label').html('');
$(area).find('label').removeClass('valid');
$(area).find('label').removeClass('success');
$(area).find('label').removeClass('error');
$(area).find('div').removeClass('error');
$(area).find('div').removeClass('success');
};
$('#faculty-add').validate({
rules : {
facul_name : {
minlength : 6,
required : true
},
facul_pic : {
required : true,
accept : "png|jpe?g|gif",
filesize : 6291456
},
facul_designation : {
required : true,
minlength : 6
},
facul_email : {
required : true,
email : true
},
datepicker : {
required : true
},
qualification : {
required : true,
minlength : 2
},
area_interest : {
required : true,
minlength : 5
}
},
highlight : function(element) {
$(element).closest('.form-control').removeClass('success').addClass('error');
},
messages : {
facul_name : {
required : "Please Enter Faculty Name"
},
facul_pic : {
required : "Choose Faculty Profile Picture"
},
facul_designation : {
required : "Enter Faculty Desgnation Ex: Asst. Professor"
},
facul_email : {
required : "Enter a valid Email ID"
},
datepicker : {
required : "Choose the faculty's Date of Joining"
},
qualification : {
required : "Mention Faculty's highest qualification"
},
area_interest : {
required : "Please mention atleast one Area of Interest"
}
},
success : function(element) {
element.text('').addClass('valid').closest('.control-group').removeClass('error').addClass('success');
},
submitHandler : function(form) {
$("#loader-modal").modal('show');
$.ajax({
type : "POST",
url : 'proc/add_faculty.php',
data : $(form).serialize(),
success : function(data) {
if (data === '0') {// Everything Successful
$("#loader-modal").modal('hide');
$("#success-modal").modal("show");
$(this).clearFormFields("#faculty-add");
} else {
if (data === '-1') {// dB Update failed
$("#loader-modal").modal('hide');
$("#failure-modal").modal("show");
} else {
if (data === '-2') {// File Upload failed
$("#loader-modal").modal('hide');
$("#upload-fail-modal").modal("show");
} else {
$("#loader-modal").modal('hide');
$("#upload-fail-modal").modal("show");
}
}
$(this).clearFormFields("#faculty-add");
}
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
$("#loader-modal").modal('hide');
$("#failure-modal").modal("show");
$(this).clearFormFields("#faculty-add");
}
});
return false;
}
});
The Processor:
if (isset($_FILES['facul_pic'])) {
$file_name = $_FILES['facul_pic']['name'];
$file_size = $_FILES['document']['size'];
$file_tmp = $_FILES['document']['tmp_name'];
$uploaded = $faculty -> upload_pic($file_name, $file_size, $file_tmp);
if ($uploaded != "failed") {// else retruns file path
$f_name = $_POST['facul_name'];
$f_department = $_POST['facul_department'];
$f_pic = $uploaded;
$f_designation = $_POST['facul_designation'];
$f_email = $_POST['facul_email'];
$f_doj = $_POST['datepicker'];
$f_qualification = $_POST['quallification'];
$f_iExp_yr = $_POST['indus_year'];
$f_iExp_mth = $_POST['indus_months'];
$f_tExp_yr = $_POST['teach_years'];
$f_tExp_mth = $_POST['teach_months'];
$f_lPub = $_POST['pub_national'];
$f_iPub = $_POST['pub_international'];
$f_interest = $_POST['area_interest'];
$resp = $faculty -> add_faculty($f_name, $f_department, $f_pic, $f_designation, $f_email, $f_doj, $f_qualification, $f_iExp_yr, $f_iExp_mth, $f_tExp_yr, $f_tExp_mth, $f_lPub, $f_iPub, $f_interest);
if ($resp == true) {
echo '0';
} else {
echo '-1';
}
} else {
echo '-2';
}
} else {
echo '-3';
}
Here the statement
if (isset($_FILES['facul_pic']))
Returns False and thus the AJAX response is always -3
Please Help me Figure this out.
