Skip to Content
PHPCODE
Multiple file input fields in one form CodeIgniter
codeigniter code / September 20, 2021

The most often utilised feature in the dynamic web application is the picture upload tool. The multiple picture upload capability allows you to simultaneously upload a huge number of files to the server. In CodeIgniter, instead of uploading one image at a time, you can upload numerous images at once. This feature is very handy in the data management section, as each entry requires many photos to be supplied.

The File Uploading Class in CodeIgniter makes it simple to upload files to the server. The Upload library in CodeIgniter may be used to incorporate the multiple image upload feature. In this lesson, we’ll teach you how to use CodeIgniter’s view, edit, and delete functionality to integrate multiple picture uploads.

We’ll create a Gallery CRUD system in CodeIgniter to illustrate the multiple picture upload management functionality. In the CodeIgniter framework, it allows the user to upload multiple photos with data and save them in the database.

We’ll use the CodeIgniter framework to create a gallery management system with multiple photographs in the sample CodeIgniter application.

Obtain gallery information from the database and display it on the webpage.
Insert form input into the database and upload several photos to the server.
View a gallery featuring a variety of photos.
Multiple photos can be edited and updated.
Remove the gallery and various photographs from your computer.

Examine the file structure before beginning to incorporate multiple picture upload management in CodeIgniter.

codeigniter_gallery_crud/
├── application/
│   ├── controllers/
│   │   └── Manage_gallery.php
│   ├── models/
│   │   └── Gallery.php
│   ├── views/
│   │   ├── gallery/
│   │   │   ├── index.php
│   │   │   ├── view.php
│   │   │   └── add-edit.php
│   │   └── templates/
│   │       ├── header.php
│   │       └── footer.php
├── assets/
│   ├── bootstrap/
│   │   └── bootstrap.min.css
│   ├── js/
│   │   └── jquery.min.js
│   ├── css/
│   │   └── style.css
│   └── images/
└── uploads/
    └── images/

 

Tables in a Database

Two tables in the database are required to store gallery data and image file information.

1. Please read the following: In the MySQL database, SQL creates a gallery table with some basic fields.

CREATE TABLE `gallery` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
`created` datetime NOT NULL,
`modified` datetime NOT NULL,
`status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

In the MySQL database, the following SQL creates a gallery images table with a parent gallery identification field (gallery id).

CREATE TABLE `gallery_images` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`gallery_id` int(11) NOT NULL,
`file_name` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
`uploaded_on` datetime NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

Config

autoload.php
Define the library and helper to load automatically on every request in the config/autoload.php file, which will be used frequently in the application.

$autoload['libraries'] = array('database', 'session'); 
$autoload['helper'] = array('url');

(Manage gallery.php) is the controller.
The Manage gallery controller is in charge of the gallery and picture CRUD actions (view, add, edit, and remove).

__construct() – constructs a new object.

Load the validation and form helper libraries.

Load the gallery model into the scene.

Set the name of the default controller.

index() is a function that returns the number of items in a

SESSION status messages can be retrieved.

The getRows() method of the Gallery model is used to retrieve records from the database.

Load the list view after passing the gallery data.

view() – Retrieves gallery data from the database based on an ID.
Load the details view after passing the gallery data.
add() – The form view is initially loaded to receive gallery and file input.
The uploaded form data is validated using the CodeIgniter Form Validation library if the form is submitted.
The insert() method of the Gallery model is used to store gallery data in the database.
Using the CodeIgniter Upload library, upload numerous photos to the server.
Using the Gallery model’s insertImage() method, store information about uploaded files in the database.

edit() – Retrieves gallery data from the database based on a unique ID.
The gallery data and images are pre-filled in the form view.
The uploaded form data is validated using the CodeIgniter Form Validation library if the form is submitted.
The update() method of the Gallery model is used to update gallery data in the database.
Using the CodeIgniter Upload library, upload specified photos to the server.
block() – Set the gallery’s state to Inactive.
unblock() – Set the gallery’s state to Active.

delete() – The delete() function of the Gallery model is used to remove gallery data from the database.
Using the deleteImage() method of the Gallery model, you can delete image data from the database.
The image files should be removed from the server.
deleteImage() – The Ajax request uses this function to delete specified picture data from both the database and the server.

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); 
class Manage_gallery extends CI_Controller { 
function __construct() { 
parent::__construct(); 
// Load form helper and form validation library 
$this->load->helper('form'); 
$this->load->library('form_validation'); 
// Load gallery model 
$this->load->model('gallery'); 
// Default controller name 
$this->controller = 'manage_gallery'; 
} 
public function index(){ 
$data = array(); 
// Get messages from the session 
if($this->session->userdata('success_msg')){ 
$data['success_msg'] = $this->session->userdata('success_msg'); 
$this->session->unset_userdata('success_msg'); 
} 
if($this->session->userdata('error_msg')){ 
$data['error_msg'] = $this->session->userdata('error_msg'); 
$this->session->unset_userdata('error_msg'); 
} 
$data['gallery'] = $this->gallery->getRows(); 
$data['title'] = 'Gallery Archive'; 
// Load the list page view 
$this->load->view('templates/header', $data); 
$this->load->view('gallery/index', $data); 
$this->load->view('templates/footer'); 
} 
public function view($id){ 
$data = array(); 
// Check whether id is not empty 
if(!empty($id)){ 
$data['gallery'] = $this->gallery->getRows($id); 
$data['title'] = $data['gallery']['title']; 

// Load the details page view 
$this->load->view('templates/header', $data); 
$this->load->view('gallery/view', $data); 
$this->load->view('templates/footer'); 
}else{ 
redirect($this->controller); 
} 
} 
public function add(){ 
$data = $galleryData = array(); 
$errorUpload = ''; 
// If add request is submitted 
if($this->input->post('imgSubmit')){ 
// Form field validation rules 
$this->form_validation->set_rules('title', 'gallery title', 'required'); 
// Prepare gallery data 
$galleryData = array( 
'title' => $this->input->post('title') 
); 
// Validate submitted form data 
if($this->form_validation->run() == true){ 
// Insert gallery data 
$insert = $this->gallery->insert($galleryData); 
$galleryID = $insert; 
if($insert){ 
if(!empty($_FILES['images']['name'])){ 
$filesCount = count($_FILES['images']['name']); 
for($i = 0; $i < $filesCount; $i++){ 
$_FILES['file']['name'] = $_FILES['images']['name'][$i]; 
$_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]; 
// File upload configuration 
$uploadPath = 'uploads/images/'; 
$config['upload_path'] = $uploadPath; 
$config['allowed_types'] = 'jpg|jpeg|png|gif'; 
// Load and initialize upload library 
$this->load->library('upload', $config); 
$this->upload->initialize($config); 
// Upload file to server 
if($this->upload->do_upload('file')){ 
// Uploaded file data 
$fileData = $this->upload->data(); 
$uploadData[$i]['gallery_id'] = $galleryID; 
$uploadData[$i]['file_name'] = $fileData['file_name']; 
$uploadData[$i]['uploaded_on'] = date("Y-m-d H:i:s"); 
}else{ 
$errorUpload .= $fileImages[$key].'('.$this->upload->display_errors('', '').') | '; 
} 
} 
// File upload error message 
$errorUpload = !empty($errorUpload)?' Upload Error: '.trim($errorUpload, ' | '):''; 
if(!empty($uploadData)){ 
// Insert files info into the database 
$insert = $this->gallery->insertImage($uploadData); 
} 
} 
$this->session->set_userdata('success_msg', 'Gallery has been added successfully.'.$errorUpload); 
redirect($this->controller); 
}else{ 
$data['error_msg'] = 'Some problems occurred, please try again.'; 
} 
} 
} 
$data['gallery'] = $galleryData; 
$data['title'] = 'Create Gallery'; 
$data['action'] = 'Add'; 
// Load the add page view 
$this->load->view('templates/header', $data); 
$this->load->view('gallery/add-edit', $data); 
$this->load->view('templates/footer'); 
} 
public function edit($id){ 
$data = $galleryData = array(); 
// Get gallery data 
$galleryData = $this->gallery->getRows($id); 
// If update request is submitted 
if($this->input->post('imgSubmit')){ 
// Form field validation rules 
$this->form_validation->set_rules('title', 'gallery title', 'required'); 
// Prepare gallery data 
$galleryData = array( 
'title' => $this->input->post('title') 
); 
// Validate submitted form data 
if($this->form_validation->run() == true){ 
// Update gallery data 
$update = $this->gallery->update($galleryData, $id); 
if($update){ 
if(!empty($_FILES['images']['name'])){ 
$filesCount = count($_FILES['images']['name']); 
for($i = 0; $i < $filesCount; $i++){ 
$_FILES['file']['name'] = $_FILES['images']['name'][$i]; 
$_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]; 
// File upload configuration 
$uploadPath = 'uploads/images/'; 
$config['upload_path'] = $uploadPath; 
$config['allowed_types'] = 'jpg|jpeg|png|gif'; 
// Load and initialize upload library 
$this->load->library('upload', $config); 
$this->upload->initialize($config); 
// Upload file to server 
if($this->upload->do_upload('file')){ 
// Uploaded file data 
$fileData = $this->upload->data(); 
$uploadData[$i]['gallery_id'] = $id; 
$uploadData[$i]['file_name'] = $fileData['file_name']; 
$uploadData[$i]['uploaded_on'] = date("Y-m-d H:i:s"); 
}else{ 
$errorUpload .= $fileImages[$key].'('.$this->upload->display_errors('', '').') | '; 
} 
} 
// File upload error message 
$errorUpload = !empty($errorUpload)?'Upload Error: '.trim($errorUpload, ' | '):''; 
if(!empty($uploadData)){ 
// Insert files data into the database 
$insert = $this->gallery->insertImage($uploadData); 
} 
} 
$this->session->set_userdata('success_msg', 'Gallery has been updated successfully.'.$errorUpload); 
redirect($this->controller); 
}else{ 
$data['error_msg'] = 'Some problems occurred, please try again.'; 
} 
} 
} 
$data['gallery'] = $galleryData; 
$data['title'] = 'Update Gallery'; 
$data['action'] = 'Edit'; 
// Load the edit page view 
$this->load->view('templates/header', $data); 
$this->load->view('gallery/add-edit', $data); 
$this->load->view('templates/footer'); 
} 
public function block($id){ 
// Check whether gallery id is not empty 
if($id){ 
// Update gallery status 
$data = array('status' => 0); 
$update = $this->gallery->update($data, $id); 

if($update){ 
$this->session->set_userdata('success_msg', 'Gallery has been blocked successfully.'); 
}else{ 
$this->session->set_userdata('error_msg', 'Some problems occurred, please try again.'); 
} 
} 
redirect($this->controller); 
} 
public function unblock($id){ 
// Check whether gallery id is not empty 
if($id){ 
// Update gallery status 
$data = array('status' => 1); 
$update = $this->gallery->update($data, $id); 
if($update){ 
$this->session->set_userdata('success_msg', 'Gallery has been activated successfully.'); 
}else{ 
$this->session->set_userdata('error_msg', 'Some problems occurred, please try again.'); 
} 
} 
redirect($this->controller); 
} 
public function delete($id){ 
// Check whether id is not empty 
if($id){ 
$galleryData = $this->gallery->getRows($id); 
// Delete gallery data 
$delete = $this->gallery->delete($id); 
if($delete){ 
// Delete images data 
$condition = array('gallery_id' => $id); 
$deleteImg = $this->gallery->deleteImage($condition); 
// Remove files from the server 
if(!empty($galleryData['images'])){ 
foreach($galleryData['images'] as $img){ 
@unlink('uploads/images/'.$img['file_name']); 
} 
} 
$this->session->set_userdata('success_msg', 'Gallery has been removed successfully.'); 
}else{ 
$this->session->set_userdata('error_msg', 'Some problems occurred, please try again.'); 
} 
} 
redirect($this->controller); 
} 
public function deleteImage(){ 
$status = 'err'; 
// If post request is submitted via ajax 
if($this->input->post('id')){ 
$id = $this->input->post('id'); 
$imgData = $this->gallery->getImgRow($id); 

// Delete image data 
$con = array('id' => $id); 
$delete = $this->gallery->deleteImage($con); 

if($delete){ 
// Remove files from the server 
@unlink('uploads/images/'.$imgData['file_name']); 
$status = 'ok'; 
} 
} 
echo $status;die; 
} 
}/* Your code... */

Modeling (Gallery.php)
The database operations are handled by the Gallery model (Fetch, Add, Edit, and Delete).

Define the table names with __construct().
getRows() is a function that returns the number of rows in a table.
Fetch gallery data from the database using the parameters supplied in the $params variable.
It delivers data with the default image of the appropriate gallery for all records.
It returns the exact gallery data for a single record, together with all of the images in that gallery.
getImgRow() — Retrieves information about an image file based on the provided row ID.
Insert gallery data into the database with insert(). If successful, returns the row ID; if unsuccessful, returns FALSE.

insertImage() — Stores information about image files in the database. If successful, returns the row ID; if unsuccessful, returns FALSE.
update() – Using the row ID, update gallery data in the database. If the function succeeds, it returns TRUE; if it fails, it returns FALSE.
remove() – Using the row ID, delete a record from the database. If the function succeeds, it returns TRUE; if it fails, it returns FALSE.
deleteImage() – Deletes a single or a group of photos from the database based on the conditions supplied.

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); 
class Gallery extends CI_Model{ 
function __construct() { 
$this->galleryTbl = 'gallery'; 
$this->imgTbl = 'gallery_images'; 
} 
/* 
* Fetch gallery data from the database 
* @param id returns a single record if specified, otherwise all records 
*/ 
public function getRows($id = ''){ 
$this->db->select("*, (SELECT file_name FROM ".$this->imgTbl." WHERE gallery_id = ".$this->galleryTbl.".id ORDER BY id DESC LIMIT 1) as default_image"); 
$this->db->from($this->galleryTbl); 
if($id){ 
$this->db->where('id', $id); 
$query = $this->db->get(); 
$result = ($query->num_rows() > 0)?$query->row_array():array(); 
if(!empty($result)){ 
$this->db->select('*'); 
$this->db->from($this->imgTbl); 
$this->db->where('gallery_id', $result['id']); 
$this->db->order_by('id', 'desc'); 
$query = $this->db->get(); 
$result2 = ($query->num_rows() > 0)?$query->result_array():array(); 
$result['images'] = $result2; 
} 
}else{ 
$this->db->order_by('id', 'desc'); 
$query = $this->db->get(); 
$result = ($query->num_rows() > 0)?$query->result_array():array(); 
} 
// return fetched data 
return !empty($result)?$result:false; 
} 
/* 
* Fetch image data from the database 
* @param id returns a single record 
*/ 
public function getImgRow($id){ 
$this->db->select('*'); 
$this->db->from($this->imgTbl); 
$this->db->where('id', $id); 
$query = $this->db->get(); 
return ($query->num_rows() > 0)?$query->row_array():false; 
} 
/* 
* Insert gallery data into the database 
* @param $data data to be insert based on the passed parameters 
*/ 
public function insert($data = array()) { 
if(!empty($data)){ 
// Add created and modified date if not included 
if(!array_key_exists("created", $data)){ 
$data['created'] = date("Y-m-d H:i:s"); 
} 
if(!array_key_exists("modified", $data)){ 
$data['modified'] = date("Y-m-d H:i:s"); 
} 
// Insert gallery data 
$insert = $this->db->insert($this->galleryTbl, $data); 
// Return the status 
return $insert?$this->db->insert_id():false; 
} 
return false; 
} 
/* 
* Insert image data into the database 
* @param $data data to be insert based on the passed parameters 
*/ 
public function insertImage($data = array()) { 
if(!empty($data)){ 
// Insert gallery data 
$insert = $this->db->insert_batch($this->imgTbl, $data); 
// Return the status 
return $insert?$this->db->insert_id():false; 
} 
return false; 
} 
/* 
* Update gallery data into the database 
* @param $data array to be update based on the passed parameters 
* @param $id num filter data 
*/ 
public function update($data, $id) { 
if(!empty($data) && !empty($id)){ 
// Add modified date if not included 
if(!array_key_exists("modified", $data)){ 
$data['modified'] = date("Y-m-d H:i:s"); 
} 
// Update gallery data 
$update = $this->db->update($this->galleryTbl, $data, array('id' => $id)); 
// Return the status 
return $update?true:false; 
} 
return false; 
} 
/* 
* Delete gallery data from the database 
* @param num filter data based on the passed parameter 
*/ 
public function delete($id){ 
// Delete gallery data 
$delete = $this->db->delete($this->galleryTbl, array('id' => $id)); 
// Return the status 
return $delete?true:false; 
} 
/* 
* Delete image data from the database 
* @param array filter data based on the passed parameter 
*/ 
public function deleteImage($con){ 
// Delete image data 
$delete = $this->db->delete($this->imgTbl, $con); 
// Return the status 
return $delete?true:false; 
} 
}

1. templates/ The views/templates/ directory contains the web template element sections (header, footer, etc.).

templates/header.php (version 1.1)

This file contains the web page’s header section. The HTML table and form are styled with the Bootstrap 4 library. As a result, include the Bootstrap library’s CSS file as well as the custom stylesheet file (if any).

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title><?php echo $title; ?> | Multiple Images Management in CodeIgniter</title>
<!-- Bootstrap library -->
<link rel="stylesheet" href="<?php echo base_url('assets/bootstrap/bootstrap.min.css'); ?>">
<script src="<?php echo base_url('assets/bootstrap/bootstrap.min.js'); ?>"></script>
<!-- Stylesheet file -->
<link rel="stylesheet" href="<?php echo base_url('assets/css/style.css'); ?>">
</head>
<body>

templates/footer.php
This file contains the web page’s footer area.

</body>
</html>

The views/gallery/ directory contains the Manage gallery controller’s view files.

gallery/index.php (version 2.1)

Initially, the database is queried for all gallery data, which is then shown in a tabular format with Add, Edit, and Delete options.

The View button shows the selected gallery’s information along with photographs.

The Add link allows you to add gallery information and multiple photographs to your gallery.

The Edit link allows you to make changes to the gallery’s information and upload/delete photographs.

Using the Delete link, you can remove galleries and photographs from the database.

The gallery’s visibility can be controlled using the Status badge (Active/Inactive).

<div class="container">
<h2>Multiple Images Management</h2>
<!-- Display status message -->
<?php if(!empty($success_msg)){ ?>
<div class="col-xs-12">
<div class="alert alert-success"><?php echo $success_msg; ?></div>
</div>
<?php }elseif(!empty($error_msg)){ ?>
<div class="col-xs-12">
<div class="alert alert-danger"><?php echo $error_msg; ?></div>
</div>
<?php } ?>
<div class="row">
<div class="col-md-12 head">
<h5><?php echo $title; ?></h5>
<!-- Add link -->
<div class="float-right">
<a href="<?php echo base_url('manage_gallery/add'); ?>" class="btn btn-success"><i class="plus"></i> New Gallery</a>
</div>
</div>
<!-- Data list table --> 
<table class="table table-striped table-bordered">
<thead class="thead-dark">
<tr>
<th width="5%">#</th>
<th width="10%"></th>
<th width="40%">Title</th>
<th width="19%">Created</th>
<th width="8%">Status</th>
<th width="18%">Action</th>
</tr>
</thead>
<tbody>
<?php if(!empty($gallery)){ $i=0; 
foreach($gallery as $row){ $i++; 
$defaultImage = !empty($row['default_image'])?'<img src="'.base_url().'uploads/images/'.$row['default_image'].'" alt="" />':''; 
$statusLink = ($row['status'] == 1)?site_url('manage_gallery/block/'.$row['id']):site_url('manage_gallery/unblock/'.$row['id']); 
$statusTooltip = ($row['status'] == 1)?'Click to Inactive':'Click to Active'; 
?>
<tr>
<td><?php echo $i; ?></td>
<td><?php echo $defaultImage; ?></td>
<td><?php echo $row['title']; ?></td>
<td><?php echo $row['created']; ?></td>
<td><a href="<?php echo $statusLink; ?>" title="<?php echo $statusTooltip; ?>"><span class="badge <?php echo ($row['status'] == 1)?'badge-success':'badge-danger'; ?>"><?php echo ($row['status'] == 1)?'Active':'Inactive'; ?></span></a></td>
<td>
<a href="<?php echo base_url('manage_gallery/view/'.$row['id']); ?>" class="btn btn-primary">view</a>
<a href="<?php echo base_url('manage_gallery/edit/'.$row['id']); ?>" class="btn btn-warning">edit</a>
<a href="<?php echo base_url('manage_gallery/delete/'.$row['id']); ?>" class="btn btn-danger" onclick="return confirm('Are you sure to delete data?')?true:false;">delete</a>
</td>
</tr>
<?php } }else{ ?>
<tr><td colspan="6">No gallery found...</td></tr>
<?php } ?>
</tbody>
</table>
</div>
</div>

Delete Gallery Image through AJAX: The image deletion capability is implemented into the view.php and add-edit.php files. Ajax is used to delete photographs from the gallery, and jQuery is used to do so.

Include the jQuery library wherever the gallery images remove feature is used.

<script src="<?php echo base_url('assets/js/jquery.min.js'); ?>"></script>

The deleteImage() function sends an AJAX request to the gallery to delete an image.

POST the file ID to the Manage gallery controller’s deleteImage() function.
Using the jQuery remove() method, delete the relevant image from the web page based on the state.

<script>
function deleteImage(id){
var result = confirm("Are you sure to delete?");
if(result){
$.post( "<?php echo base_url('manage_gallery/deleteImage'); ?>", {id:id}, function(resp) {
if(resp == 'ok'){
$('#imgb_'+id).remove();
alert('The image has been removed from the gallery');
}else{
alert('Some problem occurred, please try again.');
}
});
}
}
</script>

gallery/view.php
The view() function of the Manage gallery controller loads this view file. On the webpage, the relevant gallery information is provided.

The Delete link appears next to all of the photographs in the selected gallery.
When the Delete button is pressed, the deleteImage() method in JavaScript is called, and the corresponding image is removed from the gallery using Ajax and jQuery.

<div class="container">
<div class="row">
<div class="col-md-12">
<h5><?php echo !empty($gallery['title'])?$gallery['title']:''; ?></h5>
<?php if(!empty($gallery['images'])){ ?>
<div class="gallery-img">
<?php foreach($gallery['images'] as $imgRow){ ?>
<div class="img-box" id="imgb_<?php echo $imgRow['id']; ?>">
<img src="<?php echo base_url('uploads/images/'.$imgRow['file_name']); ?>">
<a href="javascript:void(0);" class="badge badge-danger" onclick="deleteImage('<?php echo $imgRow['id']; ?>')">delete</a>
</div>
<?php } ?>
</div>
<?php } ?>
</div>
<a href="<?php echo base_url('manage_gallery'); ?>" class="btn btn-primary">Back to List</a>
</div>
</div>

gallery/add-edit.php
The Manage gallery controller’s add() and edit() procedures load this view file.

When a request for addition is made,

An HTML form appears, allowing you to choose numerous image files and give the gallery a name.
In response to a request for an edit,

The input forms will be pre-filled with data from the selected gallery, and photos will be listed under the file upload field.
Each uploaded image has a delete link that can be used to remove older photographs from the gallery.

<div class="container">
<h1><?php echo $title; ?></h1>
<hr>
<!-- Display status message -->
<?php if(!empty($error_msg)){ ?>
<div class="col-xs-12">
<div class="alert alert-danger"><?php echo $error_msg; ?></div>
</div>
<?php } ?>
<div class="row">
<div class="col-md-6">
<form method="post" action="" enctype="multipart/form-data">
<div class="form-group">
<label>Title:</label>
<input type="text" name="title" class="form-control" placeholder="Enter title" value="<?php echo !empty($gallery['title'])?$gallery['title']:''; ?>" >
<?php echo form_error('title','<p class="help-block text-danger">','</p>'); ?>
</div>
<div class="form-group">
<label>Images:</label>
<input type="file" name="images[]" class="form-control" multiple>
<?php if(!empty($gallery['images'])){ ?>
<div class="gallery-img">
<?php foreach($gallery['images'] as $imgRow){ ?>
<div class="img-box" id="imgb_<?php echo $imgRow['id']; ?>">
<img src="<?php echo base_url('uploads/images/'.$imgRow['file_name']); ?>">
<a href="javascript:void(0);" class="badge badge-danger" onclick="deleteImage('<?php echo $imgRow['id']; ?>')">delete</a>
</div>
<?php } ?>
</div>
<?php } ?>
</div>
<a href="<?php echo base_url('manage_gallery'); ?>" class="btn btn-secondary">Back</a>
<input type="hidden" name="id" value="<?php echo !empty($gallery['id'])?$gallery['id']:''; ?>">
<input type="submit" name="imgSubmit" class="btn btn-success" value="SUBMIT">
</form>
</div>
</div>
</div>

Note :

Our CodeIgniter sample gallery management script allows you to combine the ability to upload many photos with the ability to view, add, modify, and delete them. This script can be used in any data management component that requires repeated image uploads. This example code is particularly handy for CRUD operations in galleries. You can also customise the functionality of our CodeIgniter gallery CRUD app to meet your own requirements.

PHPCODE © 2024