Multiple Files Upload in Codeigniter with Example

Share Me
  •  
  •  
  •  
  • 1
  •  
  •  
  •  
  •  
  •  
  •  
  •  
    1
    Share
Multiple Files Upload in Codeigniter

Hello Dev’s
Now today in this tutorial, from here we will learn about how to upload multiple images with codeigniter 3 Framework application. When we need to upload multi images codeigniter then this type use. So now from here you can know about simply use the multiple file upload in project. From here you can know how to Multiple Files Upload in Codeigniter

Here we will make the form and some designing with bootstrap and we will also use multiple attributes for the upload multiple images in our application.

Step 1: Create Upload Directory

here we will create assets/uploads/ directory on our own project directory.

Step 2: Create The Controller

Now we will create a new controller as Multipleimageupload.php controller in the controller directory.

So here we will load the model and also helper URL. Now when the user submits the form and needs to uploads images that time we will check the condition and also count that how many images upload. So we will be uploading images by using the for loop.Now we will rename all images by using the PATHINFO_EXTENSION and pathinfo

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Multipleimage extends CI_Controller {
  public function __construct() {
    parent::__construct();
    $this->load->model('Image_model');
    $this->load->helper('url');
  }
  public function index(){
    if ($this->input->post('submit') && $_FILES['images']['name'] != '') {
      $data = array();
      $count_images = count($_FILES['images']['name']);
 
      for($i=0;$i<$count_images;$i++){
 
        if(!empty($_FILES['images']['name'][$i])){
		  $ext = pathinfo($_FILES['images']['name'][$i], PATHINFO_EXTENSION);
		  $name = 'image' . rand(100000, 999999) . date("Y-m-d") . '.' . $ext;	
          $_FILES['file']['name'] = $name;
          $_FILES['file']['type'] = $_FILES['images']['type'][$i];
          $_FILES['file']['tmp_name'] = $_FILES['images']['tmp_name'][$i];
          $_FILES['file']['error'] = $_FILES['images']['error'][$i];
          $_FILES['file']['size'] = $_FILES['images']['size'][$i];
          $config['upload_path'] = './assets/uploads/'; 
          $config['allowed_types'] = 'jpg|jpeg|png|gif';
          $config['max_size'] = '10000';
          $config['file_name'] = $_FILES['images']['name'][$i];
 
          $this->load->library('upload',$config); 
 
          if($this->upload->do_upload('file')){
            $uploadData = $this->upload->data();
			$arrData["image_name"] =$name;
            $this->Image_model->save_image($arrData);
          }
        }
 
      }
    }
      $this->load->view('add');
  }
}
?>

Step 3: Create The Model

Now we will create the Image_model.php model in our model directory.

<?php 
defined('BASEPATH') OR exit('No direct script access allowed');
   Class Image_model extends CI_Model
   {
       function save_image($arrData)
       {
           if ($this->db->insert('file_upload_image',$arrData)) {
               return true;
           } else {
               return flase;
           }
       }
	}
?>

Step 4: Create The View

Now in this step we will create the image.php file in the views directory.

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Codeigniter Multiple Files Upload Example/https://www.codingspoint.com/</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <section class="panel">
			  <header class="panel-heading col-sm-12">
				  <h1 class="col-sm-6">Codeigniter Multiple Files Upload Example</h1>
			  </header>
                <div class="container">
                  <div class="panel-body">
                      <div class="form">
                          <?php
                          $attributes = array('name' => 'frmimage', 'id' => 'frmimage', 'class' => 'imageform form-horizontal adminex-form');
                          echo form_open_multipart('',$attributes);
                          ?>
                          <div class="form-group col-sm-12 ">
                              <div class="col-lg-8 ">
                                  <input type="file" name="images[]" multiple class="form-control">
                              </div>
                          </div>
                          <div class="form-group col-sm-12">
                              <div class="col-lg-1 col-xs-offset-2">
                                  <?php
                                  $datasubmit = array(
                                      'name'        => 'submit',
                                      'id'          => 'submit',
                                      'class'		=> 'btn btn-success',
                                      'value'		=> 'File Upload'
                                  );
                                  echo form_submit($datasubmit);
                                  ?>
                              </div>
                          </div>
                      </div>
                      <?php echo form_close(); ?>
                  </div>
              </div>			
          </section>
      </div>
  </div>
</div>
</body>
</html>

Read Also : How to remove key from array in jquery ?

Thanks for read. I hope it help you. For more you can follow us on facebook

About code chef

My name is Shahriar sagor. I'm a developer. I live in Bangladesh and I love to write tutorials and tips that will help to other Developer's. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by code chef →