How to upload image in Codeigniter with Database

Codeigniter là một trong những Framework hoạt động theo mô hình MVC. Vì vậy với những người mới học lập trình website thì đây là nền tảng khá dễ nằm bắt. Hôm nay mình sẽ hướng dẫn bạn cách upload hình ảnh trong Codeigniter lên Cơ sở dữ liệu (CSDL ) – How to upload image in Codeigniter with Database.

Trước khi bắt tay vào thực hành bạn cần xem qua bài viết này:

Hướng dẫn sử dụng Codeigniter Framework

Để cấu hình lại Codeigniter làm cho nó kết nối với Database trước đã nhé!

Bước 1: Mở file autoload.php (C:\xampp\htdocs\myproject\application\config)

Tìm đoạn $autoload[‘helper’] = array(); thay thế (replace) bằng $autoload[‘helper’] = array(‘url’,’form’);

Bước 2: Tạo thư mục uploads

upload-image-codeigniter

Bước 3: Tạo file UploadController.php (C:\xampp\htdocs\myproject\application\controllers)

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class UploadController extends CI_Controller {
public function __construct() {
parent::__construct();
}
public function upload_view(){
$this->load->view('upload_view', array('error' => ' ' ));
}
public function do_upload(){
$config = array(
'upload_path' => "./uploads/",
'allowed_types' => "gif|jpg|png|jpeg|pdf",
'overwrite' => TRUE,
'max_size' => "2048000",
'max_height' => "768",
'max_width' => "1024"
);
$this->load->library('upload', $config);
if($this->upload->do_upload())
{
$data = array('upload_data' => $this->upload->data());
$this->load->view('upload_success',$data);
}
else
{
$error = array('error' => $this->upload->display_errors());
$this->load->view('upload_view', $error);
}
}
}
?>

Bước 4: Tạo file upload_view.php (C:\xampp\htdocs\myproject\application\views)

<html>
<head>
<title>File Upload In Codeigniter</title>
</head>
<body>
<?php echo $error;?>
<?php echo form_open_multipart('uploadcontroller/do_upload');?>
<?php echo "<input type='file' name='userfile' size='20' />"; ?>
<?php echo "<input type='submit' name='submit' value='upload' /> ";?>
<?php echo "</form>"?>
</body>
</html>

Bước 5: Truy cập vào http://localhost/myproject/index.php/uploadcontroller/do_upload để tiến hành upload image

upload-image-codeigniter-1

Tiến hành upload hình ảnh lên database

Bước 1: Create Database tên là data, tiếp theo tạo bảng image_upload với đoạn code MySQL:

CREATE TABLE `image_upload` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`picture` varchar(255) COLLATE utf8_unicode_ci NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

upload-image-codeigniter-2

Bước 2: Edit lại file UploadController.php, đoạn code đầy đủ như sau:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class UploadController extends CI_Controller {
public function __construct() {
parent::__construct();
$this->load->helper('array');
$this->load->helper('url');
$this->load->database('default');
$this->load->model("UploadModel");
$this->load->helper('form');
}
public function upload_view(){
$this->load->view('upload_view', array('error' => ' ' ));
}
public function do_upload(){
$config = array(
'upload_path' => "./uploads/",
'allowed_types' => "gif|jpg|png|jpeg|pdf",
'overwrite' => TRUE,
'max_size' => "2048000",
'max_height' => "768",
'max_width' => "1024" );
$this->load->library('upload', $config);
if($this->upload->do_upload())
{
$data = array('upload_data' => $this->upload->data());
$this->load->view('upload_success',$data);
}
if($this->input->post('submit'))
{
$uploadData = $this->upload->data();
$image = $uploadData['file_name'];
$this->UploadModel->saverecords($image);
echo '<script language="javascript">alert("Đã thêm hình ảnh thành công!");</script>';
}
else
{
$error = array('error' => $this->upload->display_errors());
$this->load->view('upload_view', $error);
}
}
}
?>

Bước 3: Tạo file UploadModel.php (C:\xampp\htdocs\myproject\application\models)

<?php
class UploadModel extends CI_Model {
public function __construct() {
parent::__construct();
}
/*Insert*/
function saverecords($image)
{
$query="insert into image_upload values('','$image')";
$this->db->query($query);
}

}
?>

Truy cập http://localhost/myproject/index.php/uploadcontroller/do_upload để tiến hành upload image và kết quả như sau:

upload-image-codeigniter-3

Kết luận: Với bài viết hướng dẫn upload hình ảnh lên Database này hi vọng bạn đã bổ sung thêm kiến thức đầy đủ về Codeigniter Framework. Chúc bạn thành công!

0 0 vote
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments