Reputation: 1494
I am trying to upload an image through an AJAX call (& PHP). I am using ajaxform plugin to do so but, apparently when I submit the form the "file" input value is not being passed to the php script. Here is my HTML & JS:
<form action="upload_file.php" method="post" enctype="multipart/form-data" id="select-image">
<input type="file" name="image" size="30"/> <input type="submit" name="upload" value="Upload" />
</form>
<script>
var options = {
success: showResponse // post-submit callback
};
// bind form using 'ajaxForm'
$('#select-image').ajaxForm(options);
// post-submit callback
function showResponse(responseText, statusText, xhr, $form) {
alert('status: ' + statusText + '\n\nresponseText: \n' + responseText +
'\n\nThe output div should have already been updated with the responseText.');
}
</script>
And for testing upload.php contains:
<?php
if(isset($_POST['upload'])){
var_dump($_FILES);
}
?>
When, I submit the form all I get back is:
Array(
[image]=>
)
Am I doing something wrong? Can I even upload image through Ajaxform plugin? Suggestions please.
Thanks.
Upvotes: 2
Views: 1699
Reputation: 28
Try to add 'cache : false' in var options.
var options = {
cache : false,
success: showResponse // post-submit callback
};
Works for me.
Upvotes: 1