There are several Questions like this but I've checked them all and they don't appear to help me. I'm using CodeIgniter 2.1.4 and I'm trying to upload a file using ajax and the File Uploading Class. Whatever I try I always get the error 'You did not select a file to upload'.
I have the Controller as:
class Img extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->helper(array('form', 'url'));
}
public function index()
{
$this->load->view('img/index');
}
public function upload()
{
$imgfile = $_POST['imgfile'];
$config['upload_path'] = 'upload/';
$config['allowed_types'] = 'gif|jpg|png';
$config['max_size'] = '100';
$config['max_width'] = '1024';
$config['max_height'] = '768';
$this->load->library('upload', $config);
if (!$this->upload->do_upload('imgfile'))
{
$data = array('error' => $this->upload->display_errors('', ''));
$result['success'] = 1;
$result['message'] = $data['error'];
}
else
{
$data = array('upload_data' => $this->upload->data());
$result['success'] = 0;
$result['message'] = "Image Uploaded";
}
die(json_encode($result));
}
And the View 'img/index' as:
<div id="alert" class="alert"> </div>
<form id="addForm" action="" method="post" accept-charset="utf-8" enctype="multipart/form-data">
<input type="file" name="imgfile" id="imgfile" size="20" />
<button type="submit" id="submit_add" name="submit_add">Submit</button>
</form>
<script type="text/javascript">
$("#addForm").submit(function(e)
{
e.preventDefault();
var imgfile = $("#imgfile").val();
$.ajax({
type: "POST",
url: "?c=img&m=upload",
dataType: "json",
data: 'imgfile='+imgfile,
cache: false,
success: function(result){
$('#alert').empty().append(result.message);
}
});
});
</script>
EDIT: I'm including the malsup.com jQuery Form Plugin in the header
Though this question is old I will provide a solution I found that may assist. I had been tied up trying to resolve this issues for about two week and in those two weeks I have scanned through this question with limited help until I found the solution.
To clarify.
I hit success while using $.ajaxFileUpload I read that you are using malsup. I have to clarify that I used both of them and neither was working for the 2 weeks period.
The solution to my problems was with the .htaccess. By removing its contents and testing the application again I found out that indeed it was working with index.php at the url. Therefore I sought to investigate. I found out that my file was indeed been uploaded but being lost during redirection.
I therefore suggest that :
at the end your .htaccess should look as follows
RewriteEngine On
RewriteBase /CI_website/
#CI_website is folder where my codeigniter files are located.
#Removes access to the system folder by users.
#Additionally this will allow you to create a System.php controller,
#previously this would not have been possible.
#'system' can be replaced if you have renamed your system folder.
RewriteCond %{REQUEST_URI} ^system.*
RewriteRule ^(.*)$ /index.php?/$1 [L]
#When your application folder isn't in the system folder
#This snippet prevents user access to the application folder
#Submitted by: Fabdrol
#Rename 'application' to your applications folder name.
RewriteCond %{REQUEST_URI} ^application.*
RewriteRule ^(.*)$ /index.php?/$1 [L]
#Checks to see if the user is attempting to access a valid file,
#such as an image or css document, if this isn't true it sends the
#request to index.php
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?/$1 [L]
You can't just add the value of your input type file to the post data. That's not how this works.
Check out CodeIgniter and Uploadify if you really want to upload your files with async JS.
Change this line $imgfile = $_POST['imgfile']; to $imgfile = $_FILES['imgfile'];. Even so, you cant upload file using this, you can refer to here for submitting a form using ajax.