I have two image upload options one for icon and another for image, i have made a custom ajax image upload function in jquery, which send values to php for processing. i am getting image upload to work properly i.e if icon is clicked only icon is uploaded and if image is clicked only image is uploded, my problem is i am getting both value as set in php which is causing error in not selected(icon or image) field.
my codes are:
html
<form name="change" enctype="multipart/form-data">
<input name="icon" type="file" />
<input name="image" type="file" />
</form>
<div id="icon"><img src="---" /></div>
<div id="image "><img src="---" /></div>
<div id="result"></div>
jquery(Ajax)
$('#icon img').click(function() {
$('input[name=image ][type=file]').val(null);
$('input[name=icon][type=file]').trigger('click');
});
$('#image img').click(function() {
$('input[name=icon][type=file]').val(null);
$('input[name=image ][type=file]').trigger('click');
});
$('input[name=icon], input[name=image ]').change(function() {
change();
});
function change(){
var formData = new FormData($('form[name=change]')[0]);
formData.append("CustomField", "This is some extra data");
$.ajax({
url: 'upload.php',
type: 'POST',
data: formData,
success: (function(data){
$('#result').html(data);
}),
cache: false,
processData: false,
contentType: false
});
}
php
if(isset($_FILES['icon']) && !empty($_FILES['icon']) && $_FILES['icon'] !== ''){
echo 'icon set'.'<br />';
}
else{
echo 'icon not set'.'<br />';
}
if(isset($_FILES['image ']) && !empty($_FILES['image ']) && $_FILES['image '] !== ''){
echo 'image set'.'<br />';
}
else{
echo 'image not set'.'<br />';
}
If any one icon or image is selected to upload, I am getting result as.
icon set
image set
Please See and suggest what is causing error in php.
Thanks.
The keys "image" and "icon" are keys to arrays about the upload, so they are set, not empty, and not strings === "". Try this:
print_r($_FILES);
And see if you get what you're expecting. Also, could be formData object - Google for "php formData"