Multiple Files Upload in CodeIgniter Framework

Create new folder named assets in root project. In this folder, create new folders as below:

Create new folder named images in assets folder.

In CodeIgniter Project, Open autoload.php file in config folder. Add form and url helper to helper config as below:

$autoload['helper'] = array('form', 'url');

In CodeIgniter Project, Open config.php file in config folder. Set value for base_url config as below:

$config['base_url'] = 'http://localhost:9092/LearnCodeIgniterWithRealApps/';

Create new PHP file named demo.php in controllers folder as below:

<?php defined('BASEPATH') or exit('No direct script access allowed');

class Demo extends CI_Controller
{

    public function index()
    {
        $this->load->view('demo/index');
    }

    function do_upload()
    {
        // File upload configuration
        $config['upload_path'] = './assets/images/';
        $config['allowed_types'] = 'gif|jpg|png';
        $config['max_size'] = '1024';
        $config['encrypt_name'] = TRUE;
        $config['remove_spaces'] = TRUE;

        $this->load->library('upload', $config);
        $this->upload->initialize($config);

        $fileInfos = array();
        $errors = array();
        if (! empty($_FILES['photos']['name'])) {
            $photosCount = count($_FILES['photos']['name']);
            for ($i = 0; $i < $photosCount; $i ++) {

                // Create file upload info
                $_FILES['photo']['name'] = $_FILES['photos']['name'][$i];
                $_FILES['photo']['type'] = $_FILES['photos']['type'][$i];
                $_FILES['photo']['tmp_name'] = $_FILES['photos']['tmp_name'][$i];
                $_FILES['photo']['error'] = $_FILES['photos']['error'][$i];
                $_FILES['photo']['size'] = $_FILES['photos']['size'][$i];

                // Upload file to server
                if ($this->upload->do_upload('photo')) {
                    array_push($fileInfos, array(
                        'fileInfo' => $this->upload->data()
                    ));
                } else {
                    array_push($errors, array(
                        'error' => $this->upload->display_errors()
                    ));
                }
            }
        }

        if (count($errors) != 0) {
            $data['errors'] = $errors;
            $this->load->view('demo/index', $data);
        } else {
            $data['fileInfos'] = $fileInfos;
            $this->load->view('demo/success', $data);
        }
    }
}

In CodeIgniter Project, Open routes.php file in config folder. Set value for default_controller as below:

$route['default_controller'] = 'demo';

Create new folder named demo in views folder. In this folder, create new views as below:

Create new PHP file named index.php as below:

<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>
<html>
	<head>
		<title>Demo Page</title>
	</head>
	<body>

		<h3>Multiple Files Upload</h3>

		<?php if(isset($errors)) { ?>
    	    <ul>
    	    	<?php foreach ($errors as $error) { ?>
    	    		<li><?php echo $error['error']; ?></li>
    	    	<?php } ?>
    	    </ul>
    	<?php } ?>

		<?php echo form_open_multipart('demo/do_upload'); ?>
        	<input type="file" name="photos[]" multiple="multiple" />
            <br /><br />
            <input type="submit" value="Upload" />
		<?php echo form_close(); ?>

	</body>
</html>

Create new PHP file named success.php as below:

<?php defined('BASEPATH') or exit('No direct script access allowed'); ?>
<html>
    <head>
        <title>Success Page</title>
    </head>
    <body>

    	<h3>File Uploads Info</h3>

    	<table cellpadding="2" cellspacing="2" border="1">
    		<tr>
    			<th>File Name</th>
    			<th>File Type</th>
    			<th>File Size</th>
    			<th>Photo</th>
    		</tr>
    		<?php foreach ($fileInfos as $fileInfo) { ?>
    			<tr>
    				<td><?php echo $fileInfo['fileInfo']['file_name']; ?></td>
    				<td><?php echo $fileInfo['fileInfo']['file_type']; ?></td>
    				<td><?php echo $fileInfo['fileInfo']['file_size']; ?> byte(s)</td>
    				<td>
    					<img src="<?php echo base_url(); ?>/assets/images/<?php echo $fileInfo['fileInfo']['file_name']; ?>" width="50">
    				</td>
    			</tr>
    		<?php } ?>
    	</table>

    </body>
</html>

Access index action in Demo controller with following url: http://localhost:9092/LearnCodeIgniterWithRealApps/demo/index

Output

Select multiple image and upload file

Output

I recommend you refer to the books below to learn more about the knowledge in this article:

Create Assets Folder

Images Folder

AutoLoad Url Helper

Set BASE URL

Create Controller

Set Default Controller

Create View

Index View

Success View

Structure of CodeIgniter Project

Run Application

References