Codeigniter 4 Multiple File and Image Upload Example
Apr 23, 2022 . Admin

Hi Dev,
In this quick example, let's see codeigniter 4 multiple file upload. This post will give you simple example of codeigniter 4 multiple image upload. you will learn multiple image upload in codeigniter. you'll learn multiple file uploading in codeigniter.
I will share with you how to upload multiple image in codeigniter 4 application. we can easily do multiple file upload example in codeigniter.
So, let's follow few bellow step to upload multiple file or images example:
Step 1: Install Codeigniter 4This is optional; however, if you have not created the codeigniter app, then you may go ahead and execute the below command:
composer create-project codeigniter4/appstarter ci-newsStep 2: Basic Configurations
Next, we will set some basic configuration on the app/config/app.php file, so let’s go to application/config/config.php and open this file on text editor.
public $baseURL = 'http://localhost:8080'; To public $baseURL = 'http://localhost/demo/';Step 3: Create Database With Table
In this third step, we need to create a database name demo, so let’s open your PHPMyAdmin and create the database with the name demo. After successfully create a database, you can use the below SQL query for creating a table in your database.
CREATE TABLE files ( id int(11) NOT NULL AUTO_INCREMENT COMMENT 'Primary Key', name varchar(100) NOT NULL COMMENT 'Name', type varchar(255) NOT NULL COMMENT 'file type', created_at varchar(20) NOT NULL COMMENT 'Created date', PRIMARY KEY (id) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 COMMENT='demo table' AUTO_INCREMENT=1;Step 4: Setup Database Credentials
We need to connect our project to the database. we need to go app/Config/Database.php and open database.php file in text editor. After opening the file in a text editor, We need to set up database credentials in this file like below.
app/Config/Database.phppublic $default = [ 'DSN' => '', 'hostname' => 'localhost', 'username' => 'root', 'password' => '', 'database' => 'demo', 'DBDriver' => 'MySQLi', 'DBPrefix' => '', 'pConnect' => false, 'DBDebug' => (ENVIRONMENT !== 'production'), 'cacheOn' => false, 'cacheDir' => '', 'charset' => 'utf8', 'DBCollat' => 'utf8_general_ci', 'swapPre' => '', 'encrypt' => false, 'compress' => false, 'strictOn' => false, 'failover' => [], 'port' => 3306, ];Step 5: Create Controller
So, in this step we will need to create app/Controllers and create a controller name Form.php. In this controller, we will create some method/function.
app/Controllers/Form.php<?php namespace App\Controllers; use CodeIgniter\Controller; class Form extends Controller { /** * Write code on Method * * @return response() */ public function multipleImage() { return view('multiple-image'); } /** * Write code on Method * * @return response() */ public function storeMultipleFile() { helper(['form', 'url']); $db = \Config\Database::connect(); $builder = $db->table('file'); $msg = 'Please select a valid files'; if ($this->request->getFileMultiple('file')) { foreach($this->request->getFileMultiple('file') as $file) { $file->move(WRITEPATH . 'uploads'); $data = [ 'name' => $file->getClientName(), 'type' => $file->getClientMimeType() ]; $save = $builder->insert($data); $msg = 'Files has been uploaded'; } } return redirect()->to( base_url('public/index.php/form/multipleImage') )->with('msg', $msg); } }Step 6: Create Views
In this step now we require to engender multiple-image.php, go to application/views/ folder and engender multiple-image.php file. and update the following HTML into your files:
<!DOCTYPE html> <html> <head> <title>Codeigniter 4 Multiple Image upload example - MyWebtuts.com</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> </head> <body> <div class="container"> <br> <?php if (session('msg')) : ?> <div class="alert alert-info alert-dismissible"> <?= session('msg') ?> <button type="button" class="close" data-dismiss="alert"><span>×</span></button> </div> <?php endif ?> <div class="row"> <div class="col-md-9"> <form action="<?php echo base_url('public/index.php/form/storeMultipleFile');?>" name="ajax_form" id="ajax_form" method="post" accept-charset="utf-8" enctype="multipart/form-data"> <div class="form-group"> <label for="formGroupExampleInput">Select Files</label> <input type="file" name="file[]" class="form-control" id="file" multiple> </div> <div class="form-group"> <button type="submit" id="send_form" class="btn btn-success">Submit</button> </div> </form> </div> </div> </div> </body> </html>Step 7: Run Codeigniter App:
All the required steps have been done, now you have to type the given below command and hit enter to run the Codeigniter app:
php spark serve
Now, Go to your web browser, type the given URL and view the app output:
http://localhost:8080/
It will help you....