Kamis, 05 Maret 2020

PBKK A - Tugas 6. Upload Image pada Template SBAdmin dengan CodeIgniter

Pada tugas sebelumnya kita telah membuat CRUD pada Template SBAdmin dengan CodeIgniter.
Dengan fitur CRUD kita sudah dapat menambahkan data baru, menampilkan data, mengedit data, dan menghapus data.
Namun pada menu menambahkan data produk baru, kita belum dapat meng-upload gambar dari produk tersebut.
Maka dari itu, pada kesempatan kali ini kita akan menambahkan fitur untuk Upload Image dengan CodeIgniter.

Jika pada proses penambahan data tidak ada image yang diupload, maka akan secara default diisikan dengan nilai default.jpg.
File default.jpg ini adalah file default yang akan mengisi bagian photo dari product.
Alamat path dari file tersebut yaitu /upload/product/default.jpg, maka dari itu kita harus membuat path tersebut terlebih dahulu.
1. Buat folder baru bernama upload di dalam project.
2. Di dalam folder upload, buat folder baru lagi bernama product
3. Masukkan file default.jpg ke dalam folder product.
File default.jpg yang akan kita gunakan yaitu image di bawah ini


Pengaturan nilai default untuk image selesai.
Selanjutnya yaitu membuat fitur upload image.

1. Buka file Product_model.php pada direktori ~/models/ dan tambahkan method _uploadImage() di bawah method delete()
Berikut adalah kode dari method _uploadImage()

private function _uploadImage()
{
    $config['upload_path']          = './upload/product/';
    $config['allowed_types']        = 'gif|jpg|png|jpeg';
    $config['file_name']            = $this->product_id;
    $config['overwrite']   = true;
    $config['max_size']             = 1024; // 1MB
    // $config['max_width']            = 1024;
    // $config['max_height']           = 768;

    $this->load->library('upload', $config);

    if ($this->upload->do_upload('image')) {
        return $this->upload->data("file_name");
    }
    
    return "default.jpg";
}

2. Ubah method save() dan update() pada file Product_model.php
Ubah method save() menjadi seperti di bawah ini

public function save()
    {
        $post = $this->input->post();
        $this->product_id = uniqid();
        $this->name = $post["name"];
        $this->price = $post["price"];
        $this->image = $this->_uploadImage();
        $this->description = $post["description"];
        return $this->db->insert($this->_table, $this);
    }

Ubah method update() menjadi seperti di bawah ini

public function update()
    {
        $post = $this->input->post();
        $this->product_id = $post["id"];
        $this->name = $post["name"];
        $this->price = $post["price"];

        if (!empty($_FILES["image"]["name"])) {
            $this->image = $this->_uploadImage();
        } else{
            $this->image = $post["old_image"];
        }

        $this->description = $post["description"];
        $this->db->update($this->_table, $this, array('product_id' => $post['id']));
    }

3. Menghapus file yang di-upload apabila data dihapus
Tambahkan method _deleteImage() di bawah method _uploadImage()


private function _deleteImage($id)
{
    $product = $this->getById($id);
    if ($product->image != "default.jpg") {
     $filename = explode(".", $product->image)[0];
  return array_map('unlink', glob(FCPATH."upload/product/$filename.*"));
    }
}

4. Panggil method _deleteImage() pada method detele() , sehingga menjadi seperti di bawah ini


public function delete($id)
    {
        $this->_deleteImage($id);
        return $this->db->delete($this->_table, array("product_id" => $id));
    }


Melakukan Uji Coba
Project dapat diakses melalui http://localhost/TugasUploadImage_PBKK/index.php/admin

Menambahkan data baru tanpa meng-upload image





Menambahkan data baru dengan meng-upload image






Menghapus file image yang datanya dihapus dari database





SELESAI

Source Code : klik disini

Tidak ada komentar:

Posting Komentar