CodeIgniter has upload library which makes easier to handle file uploading.
Sometimes need to allow multiple files upload to the web application. This can easily add by separately creating a file element for selection.
But this can handle with single file element by adding multiple attribute.
Need to loop on selected files for upload.
In this tutorial, I show how you can upload multiple files in CodeIgniter.
Contents
1. Create directory
Create a uploads directory at the project root to store files.
2. Controller
Create a User.php file in application/controllers directory.
- _construct() – Load
urlhelper. - index() – On form submit count total files and loop on it. Define a new
$_FILES['file']array. Set upload preference and loaduploadlibrary.
In $this->upload->do_upload('file') pass the created $_FILES['file'] keyname "file".
Initialize $data['filenames'] with $filename on successfully upload.
Completed Code
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class User extends CI_Controller {
public function __construct() {
parent::__construct();
// load base_url
$this->load->helper('url');
}
public function index(){
// Check form submit or not
if($this->input->post('upload') != NULL ){
$data = array();
// Count total files
$countfiles = count($_FILES['files']['name']);
// Looping all files
for($i=0;$i<$countfiles;$i++){
if(!empty($_FILES['files']['name'][$i])){
// Define new $_FILES array - $_FILES['file']
$_FILES['file']['name'] = $_FILES['files']['name'][$i];
$_FILES['file']['type'] = $_FILES['files']['type'][$i];
$_FILES['file']['tmp_name'] = $_FILES['files']['tmp_name'][$i];
$_FILES['file']['error'] = $_FILES['files']['error'][$i];
$_FILES['file']['size'] = $_FILES['files']['size'][$i];
// Set preference
$config['upload_path'] = 'uploads/';
$config['allowed_types'] = 'jpg|jpeg|png|gif';
$config['max_size'] = '5000'; // max_size in kb
$config['file_name'] = $_FILES['files']['name'][$i];
//Load upload library
$this->load->library('upload',$config);
// File upload
if($this->upload->do_upload('file')){
// Get data about the file
$uploadData = $this->upload->data();
$filename = $uploadData['file_name'];
// Initialize array
$data['filenames'][] = $filename;
}
}
}
// load view
$this->load->view('user_view',$data);
}else{
// load view
$this->load->view('user_view');
}
}
}
3. View
Create a user_view.php file in application/views directory.
Create a <form> and to enable multiple file selection add multiple attribute in <input type='file'> and set the name='files[]'.
Completed Code
<!doctype html>
<html>
<head>
<title>How to upload Multiple Files and Images in CodeIgniter</title>
</head>
<body>
<!-- Display Message -->
<b><?php if(isset($filenames)) echo "Successfully uploaded ".count($filenames)." files"; ?></b>
<!-- Form -->
<form method='post' action='<?php echo base_url(); ?>' enctype='multipart/form-data'>
<input type='file' name='files[]' multiple > <br/><br/>
<input type='submit' value='Upload' name='upload' />
</form>
</body>
</html>
4. Conclusion
You need to add multiple attribute to file element for enabling select more than one file and set its name as array type by putting [].
On <form > submit loop on the files and create a new $_FILES array for uploading.
Hi, one question, why the name of the files are being changed in the uploads folder after uploading?
where is model code
How to upload multiples files using multiple file inputs?
How can I display upload image by modifying your code?
Hi!
When I download your example it’s working. But when I set the code in my codeigniter webpage, it doesn’t upload and neither show any error message.
What setting or configuration could cause this error? How to fix it?
Thanks
Hi Sir,
Hope you are doing well,
Sorry to disturb you.
Actually i wanted to upload single single file by using multiple input button.
Pls hint me sir.
Thank You
Abhinit Kumar Singh
Thanks sir
Hi Yogesh,
Can you amend your coding so that there is a limit to the number of files/images that can be uploaded?
Also can you provide the coding for images to be first displayed in thumbnail & when clicked the images are enlarged & scrolled horizontally or vertically?
Thanks, it was super useful and easy to understand your code.