Ticker

6/recent/ticker-posts

Header Ads Widget

Cara Upload Gambar di Codeigniter 3

Aguzrybudy January 26, 2021

Assalmualaikum Warahmatullahi Wabarakatu
Bismillahirrahmanirrahiim

Pada postingan sebelumnya saya telah menulis tentang CRUD Codeigniter 3 dengan Konsep MVC (Model, View , Controller) dan untuk kali ini kita kan melanjutkan postingan mengenai Cara Upload Gambar di Codeigniter 3

Untuk membuat fungsi upload gambar/file di codeigniter silahkan ikuti langkah-langkah dibawah ini

Langkah Pertama

Bacalah tutorial Cara install framework codeigniter 3.0.6 untuk menginstall framework codeigniter, kemudian baca tutorial Memulai dan Mengkonfigurasi Framework Codeigniter (CI) untuk konfigurasi dasar framework codeigniter, dan baca tutorial Setting Koneksi single dan Multi Dabatabase Framework Codeigniter (CI) untuk koneksi kedatabase mysql

Langkah Kedua

Download file-file (sebuah zip didalamnya ada folder assets) yang dibutuhkan pada link berikut ini dan extract pada folder root codeigniter anda. Download

Langkah Ketiga
Buatlah Database dengan nama yang anda inginkan kemudian excute query dibawah ini, untuk struktur tabel mahasiswa

-- ----------------------------
-- Table structure for mahasiswa
-- ----------------------------
DROP TABLE IF EXISTS `mahasiswa`;
CREATE TABLE `mahasiswa`  (
  `id` int NOT NULL AUTO_INCREMENT,
  `nim` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  `nama` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  `kelas` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  `jurusan` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  `avatar` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 19 CHARACTER SET = latin1 COLLATE = latin1_swedish_ci ROW_FORMAT = Compact;

-- ----------------------------
-- Records of mahasiswa
-- ----------------------------
INSERT INTO `mahasiswa` VALUES (13, '100', 'John doe', 'Pagi', 'Manajemen Informatika', '105-1055656_account-user-profile-avatar-avatar-user-profile-icon.png');
INSERT INTO `mahasiswa` VALUES (14, '101', 'Jane Doe', 'Karyawan', 'Manajemen Informatika', 'student-project_tba1.jpg');
INSERT INTO `mahasiswa` VALUES (15, '1003', 'Waluyo', 'Pagi', 'Manajemen Informatika', 'student-project_tba2.jpg');
INSERT INTO `mahasiswa` VALUES (16, '102', 'Andini', 'Malam', 'Sitem Informasi', 'student-project_tba3.jpg');
INSERT INTO `mahasiswa` VALUES (17, '1004', 'Budiman', 'Pagi', 'Manajemen Informatika', 'student-project_tba4.jpg');
INSERT INTO `mahasiswa` VALUES (18, '105', 'Daru', 'Malam', 'Manajemen Informatika', 'student-project_tba5.jpg');

Langkah Keempat
Buatlah Controller dengan nama Mahasiswa, Kemudian ketiklah kode dibawah ini kalau anda belum perna buat coba baca Cara membuat controller di framework codeigniter 

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

class Mahasiswa extends CI_Controller {

	public function __construct()
	{
		parent::__construct();
		$this->load->model('MahasiswaModel');
	}

	public function index()
	{
		$data['jumlah_data'] = $this->MahasiswaModel->jumlah_data();
		$data['mahasiswa'] = $this->MahasiswaModel->read();
		$this->load->view('mahasiswa/read', $data);
	}

	public function create()
	{
		$this->load->view('mahasiswa/create');
	}

	public function save()
	{
		$this->form_validation->set_rules('nim', 'NIM', 'trim|required',array('required' => 'Please enter a nim'));
		$this->form_validation->set_rules('nama', 'Nama', 'trim|required',array('required' => 'Please enter a name'));
		$this->form_validation->set_rules('kelas', 'Kelas', 'trim|required',array('required' => 'Please select a kelas'));
		$this->form_validation->set_rules('jurusan', 'Jurusan', 'trim|required',array('required' => 'Please select a jurusan'));

		if ($this->form_validation->run() == FALSE)
        {
        	$page_data['errors'] = validation_errors();
        	$this->create();
        }else{
			
			// Script untuk upload gambar
			$config['upload_path'] = './assets/images';
			$config['allowed_types'] = 'jpg|png|jpeg|webp';
			$config['max_size'] = '2048';
			$this->upload->initialize($config);
			if(!$this->upload->do_upload('avatar')){ 
				$this->session->set_userdata('upload_error', $this->upload->display_errors());
				$this->create();
			}else{
				
				// Hapus session upload error_get_last
				$this->session->unset_userdata('upload_error');
				
				// Ambil data avatar yang di upload
				$upload = $this->upload->data();
				
				$data = array(
					'nim' => $this->input->post('nim'),
					'nama' => $this->input->post('nama'),
					'kelas' => $this->input->post('kelas'),
					'jurusan' => $this->input->post('jurusan'),
					'avatar' => $upload['file_name']
				);
				$this->MahasiswaModel->save($data);
				redirect('mahasiswa','refresh');
			}   
        }
	}

	public function edit($id)
	{
		$data['row']= $this->MahasiswaModel->edit($id);
		$this->load->view('mahasiswa/edit', $data);
	}

	public function update()
	{
		$this->form_validation->set_rules('nim', 'NIM', 'trim|required',array('required' => 'Please enter a nim'));
		$this->form_validation->set_rules('nama', 'Nama', 'trim|required',array('required' => 'Please enter a name'));
		$this->form_validation->set_rules('kelas', 'Kelas', 'trim|required',array('required' => 'Please select a kelas'));
		$this->form_validation->set_rules('jurusan', 'Jurusan', 'trim|required',array('required' => 'Please select a jurusan'));

		$id = $this->input->post("id");
		$avatar = $this->input->post("avatar_old");
		
		if ($this->form_validation->run() == FALSE)
        {
        	$page_data['errors'] = validation_errors();
        	$this->edit($id);
        }else{
			
			// Script untuk upload gambar
			$config['upload_path'] = './assets/images';
			$config['allowed_types'] = 'jpg|png|jpeg|webp';
			$config['max_size'] = '2048';
			$this->upload->initialize($config);
			
			// Check jika avatar diganti
			if (!empty($_FILES['avatar']['name'])) {
				if(!$this->upload->do_upload('avatar')){ 
					$this->session->set_userdata('upload_error', $this->upload->display_errors());
					$this->edit($id);
				}else{
					// Hapus session upload error_get_last
					$this->session->unset_userdata('upload_error');
					
					// Hapus gambar yang lama
					if(file_exists("assets/images/$avatar") && $avatar)
					{
						unlink("assets/images/$avatar");
					}
		
					// Ambil data avatar yang di upload
					$upload = $this->upload->data();
					$avatar = $upload['file_name'];
				}
			}				
			
			$data = array(
				'nim' => $this->input->post('nim'),
				'nama' => $this->input->post('nama'),
				'kelas' => $this->input->post('kelas'),
				'jurusan' => $this->input->post('jurusan'),
				'avatar' => $avatar
			);
			
        	$this->MahasiswaModel->update($id, $data);
        	redirect('mahasiswa','refresh');
        }
	}

	public function delete($id)
	{
		$row = $this->MahasiswaModel->edit($id);
		// Hapus gambar yang lama
		if(file_exists("assets/images/$row->avatar") && $row->avatar)
		{
			unlink("assets/images/$row->avatar");
		}
					
		$this->MahasiswaModel->delete($id);
		redirect('mahasiswa','refresh');
	}
}

Langkah kelima
Buatlah Model dengan nama MahsiswaModel, Kemudian ketiklah kode dibawah ini kalau sobat belum perna buat coba baca Cara Membuat Model Pada Framework Codeigniter 

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

class MahasiswaModel extends CI_Model {

	public function __construct()
	{
		parent::__construct();
	}

	public function jumlah_data()
	{
		return $this->db->count_all('mahasiswa');
	}

	public function read()
	{
		return $this->db->get('mahasiswa')->result();
	}
	
	public function save($data)
	{

		return $this->db->insert('mahasiswa', $data);
	}

	public function edit($id)
	{
		return $this->db->get_where('mahasiswa', array('id' => $id))->row();
	}

	public function update($id, $data)
	{
		return $this->db->where('id', $id)->update('mahasiswa', $data);
	}

	public function delete($id)
	{
		return $this->db->delete('mahasiswa', array('id' => $id));
	}



}

Langkah Keenam
Buatlah sebuah folder didalam view dengan nama mahasiswa, kemudian buatlah tiga file dengan nama read.php, create.php, edit.php untuk masing kodenya sobat bisa ketik dari list kode dibawah ini

read.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Crud CodeIgniter</title>
	<link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.min.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/css/style.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/font-awesome/css/font-awesome.css');?>" type="text/css">
	<script src="<?php echo base_url('assets/js/jquery.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/jquery-migrate.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/tether.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/bootstrap.min.js');?>" type="text/javascript"></script>
	<style>
		.img-avatar{
			height:100px;
			width:100px;
			object-fit:cover;
		}
	</style>
</head>
<body>

	<div id="wrapper">
		<div class="container">
			<h3>Cara Upload Gambar di Codeigniter 3 </h3>
			<p>By: Aguzrybudy, 2021 Januari 2021 (Senin) <a href="<?php echo base_url('mahasiswa/create/');?>" class="btn btn-primary pull-right"><i class="fa fa-plus" aria-hidden="true"></i> Mahasiswa</a></p>

			<table class="table table-striped table-layout">
			  <thead>
			    <tr>
			      <th>#</th>
			      <th>NPM</th>
			      <th>Nama</th>
			      <th>Kelas</th>
			      <th>Jurusan</th>
				  <th>Avatar</th>
			      <th>Pilihan</th>
			    </tr>
			  </thead>
			  <tbody>

			  	<?php if($jumlah_data > 0):?>
			  		<?php $no=0; foreach ($mahasiswa as $m): $no++ ?>
				    <tr class="data">
				      <th><?php echo $no;?></th>
				      <td><?php echo $m->nim;?></td>
				      <td><?php echo $m->nama;?></td>
				      <td><?php echo $m->kelas;?></td>
				      <td><?php echo $m->jurusan;?></td>
					  <td><img class="img-circle img-avatar" src="<?php echo base_url("assets/images/$m->avatar");?>" alt="<?php echo $m->avatar;?>"/></td>
				      <td>
				      	<a  href="<?php echo base_url('mahasiswa/edit/'.$m->id);?>"><i class="fa fa-edit" aria-hidden="true"></i></a>
				      	<a  href="<?php echo base_url('mahasiswa/delete/'.$m->id);?>"><i class="fa fa-trash" aria-hidden="true"></i></a>
				      </td>
				    </tr>
					<?php endforeach;?>

				<?php else:?>

				    <tr class="kosong">
				    	<td colspan="7">Tidak ada data di dalam field</td>
				    </tr>

				<?php endif;?>


			  </tbody>
			</table>

		</div>
	</div>

</body>
</html>

create.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Crud CodeIgniter</title>
	<link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.min.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/css/style.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/font-awesome/css/font-awesome.css');?>" type="text/css">
	<script src="<?php echo base_url('assets/js/jquery.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/jquery-migrate.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/tether.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/bootstrap.min.js');?>" type="text/javascript"></script>

</head>
<body>

	<div id="wrapper">
		<div class="container">
			<h3>Crud Menggunakan Codeigniter </h3>
			<p>By: Aguzrybudy, 2021 Januari 2021 (Senin) <a href="<?php echo base_url('mahasiswa');?>" class="btn btn-primary pull-right"><i class="fa fa-arrow-left" aria-hidden="true"></i> Back</a></p>

			<div class="grid-layout">
				<form method="post" action="<?php echo base_url('mahasiswa/save');?>" enctype="multipart/form-data">
					  <div class="form-group">
					    <label for="nim">NIM</label>
					    <input type="text" class="form-control" id="nim" placeholder="Enter NIM" name="nim" value="<?php echo set_value('nim');?>">
					    <?php echo form_error('nim', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Nama">Nama</label>
					    <input type="text" class="form-control" id="Nama" placeholder="Nama" name="nama" value="<?php echo set_value('nama');?>">
					     <?php echo form_error('nama', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Kelas">Kelas</label>
					    <select class="form-control" id="Kelas" name="kelas">
					      <option value="<?php echo set_value('kelas');?>"><?php echo set_value('kelas')?set_value('kelas'):"Select";?></option>
					      <option value="Pagi">Pagi</option>
					      <option value="Siang">Siang</option>
					      <option value="Malam">Malam</option>
					      <option value="Karyawan">Karyawan</option>
					    </select>
					     <?php echo form_error('kelas', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Jurusan">Jurusan</label>
					    <select class="form-control" id="Jurusan" name="jurusan">
					      <option value="<?php echo set_value('jurusan');?>"><?php echo set_value('jurusan')?set_value('jurusan'):"Select";?></option>
					      <option value="Manajemen Informatika">Manajemen Informatika</option>
					      <option value="Sitem Informasi">Sitem Informasi</option>
					      <option value="Tehnik Informatika">Tehnik Informatika</option>
					      <option value="Sistem Komputer">Sistem Komputer</option>
					      <option value="Akutansi">Akutansi</option>
					    </select>
					     <?php echo form_error('jurusan', '<div class="error">', '</div>'); ?>
					  </div>
					  
					  <div class="form-group">
					    <label for="avatar">Avatar</label>
					    <input type="file" class="form-control" id="avatar" name="avatar">
						<?php if($this->session->userdata("upload_error")):?>
							<div class="error"><?php echo $this->session->userdata("upload_error");?></div>
						<?php endif;?>
					  </div>

					  <button type="button" class="btn btn-danger" onclick="self.history.back()">Cancel</button>
					  <button type="submit" class="btn btn-primary">Submit</button>
					</form>
			</div>

		</div>
	</div>

</body>
</html>

edit.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Crud CodeIgniter</title>
	<link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.min.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/css/style.css');?>" type="text/css">
	<link rel="stylesheet" href="<?php echo base_url('assets/font-awesome/css/font-awesome.css');?>" type="text/css">
	<script src="<?php echo base_url('assets/js/jquery.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/jquery-migrate.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/tether.min.js');?>" type="text/javascript"></script>
	<script src="<?php echo base_url('assets/js/bootstrap.min.js');?>" type="text/javascript"></script>
	<style>
		.img-avatar{
			height:100px;
			width:100px;
			object-fit:cover;
		}
	</style>
</head>
<body>

	<div id="wrapper">
		<div class="container">
			<h3>Crud Menggunakan Codeigniter </h3>
			<p>By: Aguzrybudy, 2021 Januari 2021 (Senin) <a href="<?php echo base_url('mahasiswa');?>" class="btn btn-primary pull-right"><i class="fa fa-arrow-left" aria-hidden="true"></i> Back</a></p>

			<div class="grid-layout">
				<form method="post" action="<?php echo base_url('mahasiswa/update');?>" enctype="multipart/form-data">
					  <input type="hidden" name="id" value="<?php echo $row->id;?>">
					  <input type="hidden" name="avatar_old" value="<?php echo $row->avatar;?>">
					  
					  <div class="form-group">
					    <label for="nim">NIM</label>
					    <input type="text" class="form-control" id="nim" aria-describedby="NPMHelp" placeholder="Enter NIM" name="nim" value="<?php echo $row->nim;?>">
					    <?php echo form_error('nim', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Nama">Nama</label>
					    <input type="text" class="form-control" id="Nama" placeholder="Nama" name="nama" value="<?php echo $row->nama;?>">
					     <?php echo form_error('nama', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Kelas">Kelas</label>
					    <select class="form-control" id="Kelas" name="kelas">
					      <option value="<?php echo $row->kelas;?>"><?php echo $row->kelas;?></option>
					      <option value="Pagi">Pagi</option>
					      <option value="Siang">Siang</option>
					      <option value="Malam">Malam</option>
					      <option value="Karyawan">Karyawan</option>
					    </select>
					     <?php echo form_error('kelas', '<div class="error">', '</div>'); ?>
					  </div>

					  <div class="form-group">
					    <label for="Jurusan">Jurusan</label>
					    <select class="form-control" id="Jurusan" name="jurusan">
					      <option value="<?php echo $row->jurusan;?>"><?php echo $row->jurusan;?></option>
					      <option value="Manajemen Informatika">Manajemen Informatika</option>
					      <option value="Sitem Informasi">Sitem Informasi</option>
					      <option value="Tehnik Informatika">Tehnik Informatika</option>
					      <option value="Sistem Komputer">Sistem Komputer</option>
					      <option value="Akutansi">Akutansi</option>
					    </select>
					    <?php echo form_error('jurusan', '<div class="error">', '</div>'); ?>
					  </div>
					  
					  <div class="form-group">
						<img class="img-circle img-avatar" src="<?php echo base_url("assets/images/$row->avatar");?>" alt="<?php echo $row->avatar;?>"/>
					  </div>
					  <div class="form-group">
					    <label for="avatar">Avatar</label>
					    <input type="file" class="form-control" id="avatar" name="avatar">
						<?php if($this->session->userdata("upload_error")):?>
							<div class="error"><?php echo $this->session->userdata("upload_error");?></div>
						<?php endif;?>
					  </div>

					  <button type="button" class="btn btn-danger" onclick="self.history.back()">Cancel</button>
					  <button type="submit" class="btn btn-primary">Submit</button>
					</form>
			</div>

		</div>
	</div>

</body>
</html>

Langkah Ketujuh
Jika semuanya benar coba eksekusi atau jalankan program anda melalui web browser kesayangan anda, dan lihat hasilnya jika benar andaakan melihat seperti gambar dibawah ini


Sampai disini dulu tutorial dari saya tentang codeigniter 3 dan nantikan tutorial selanjutnya, Semoga tutorial ini bermanfaat bagi anda, atas segala kekuranganya mohon dimaafkan dan jika ingin bertanya silahkan tinggalkan komentar dibawah postingan ini, untuk download source dan demo dari code diatas bisa klik link dibawah ini.

Tags:

Post a Comment

1 Comments

  1. masturo.com19 September 2022 at 04:14:00 GMT+7

    tutornya keren gan, bisa diaktiin lagi link download source code-nya gan

    ReplyDelete

Berkomentarlah dengan baik dan sopan

Rekomendasi Untuk Anda × − +