Mengedit Data & Gambar Menggunakan Codeigniter

Mei 01, 2018 deifa satrio 15 Comments


halo halo gimana kabar nya kawan ? baik kan ? kali ini seperti biasa saya akan melanjutkan artikel sebelumnya yaitu membuat input data beserta gambar, jadi untuk yang belum baca artikel-artikel yang sebelumnya silahkan baca terlebih dahulu supaya gak bingung ya kawan. Ok sesuai judul, artikel kali ini saya akan menjelaskan edit data sekaligus gambar.

Sebelum kita beranjak ke coding, kita harus tau dulu alur dari edit data sekaligus gambar seperti berikut :
1. user mengedit data.
2. jika user hanya mengedit data saja tanpa mengedit gambar, maka gambar tidak berubah.
3. jika user mengedit data sekaligus foto maka data akan berubah dan foto akan berganti.
4. eksekusi aksi user.


Setelah faham dengan alurnya sekarang kita lanjut ke coding. Ikuti langkah di bawah ini dengan teliti dan hati-hati:

1. Ubah file "edit.php" yang berada di "belajarci/application/views/edit.php" seperti berikut.


Penjelasan Script :  

 - Script "form_open_multipart" memiliki fungsi untuk membolehkan form    mengupload file. 

 - Untuk script 
" <?php if($row->gambar==''){ ?>

 <label>Belum Ada Gambar</label><br>

 <?php }else{ ?>

<img src="<?php echo base_url('uploads/thumbnail/'.$row->gambar)?>"><br>


 <?php }?> " berfungsi untuk memperindah tampilan aja, hehehe. jadi bila misal data buku itu sudah memiliki gambar, maka akan di tampilkan gambar tersebut, dan apabila tidak memiliki gambar maka akan muncul tulisan "Belum ada gambar".

 - kemudian untuk script " <input type="file" name="gambar"> " berfungsi untuk membuat form inputan untuk file atau foto yang akan di tambahkan.



2. Jika sudah Edit fungsi "edit()" di controller "C_buku.php" yang berada di folder "belajarci/application/controllers/C_buku.php" menjadi seperti berikut.


Penjelasan Script :

 - Script " $config = array(......); " berfungsi untuk membuat setelah upload file seperti lokasi, format file yang di ijinkan dan ukuran maksimal sebuah file.

 - Lalu script  
              " $id = $this->input->post('id');
$judul = $this->input->post('judul');
$tebal = $this->input->post('tebal');
$penerbit = $this->input->post('penerbit'); " 
berfungsi untuk mengambil data berupa text yang telah di postkan atau di kirim dari form edit.

 -  Selanjutnya untuk script 
"  if($foto->num_rows()>0){
      $pros=$foto->row();
      $name=$pros->gambar;
      
      if(file_exists($lok=FCPATH.'/uploads/'.$name)){
        unlink($lok);
      }
      if(file_exists($lok=FCPATH.'/uploads/thumbnail/'.$name)){
        unlink($lok);
      }} "

 berfungsi untuk meng unlink atau menghapus file foto yang tersimpan pada folder uploads dan thumbnail, bingung kan ? hehehehe. saya jelasin pelan-pelan, jadi misal kalian udah input data dan gambarnya ya kawan, kan pasti foto nya itu di taruh di suatu folder penyimpanan kan, nah unlink itu berfungsi untuk menghapus foto yang tersimpan di folder penyimpanan tersebut. 

 Dalam kasus ini saya gunakan untuk menghindari apabila data telah memiliki gambar, kemudian di edit gambar nya, jika tidak kita unlink nanti file fotonya akan menumpuk.

 - Selanjutnya script " $this->load->library('upload',$config); " memiliki fungsi untuk menset library upload file sesuai setelan yang kitu sudah buat di variable array " $config ".

 - Dan yang terakhir adalah script berikut
" if($this->upload->do_upload('gambar')){

 $finfo = $this->upload->data();
$nama_foto = $finfo['file_name'];

 $data_buku = array(
'judul'=>$judul,
'tebal'=>$tebal,
'penerbit'=>$penerbit,
'gambar'=>$nama_foto
);

 $config2 = array(
'source_image'=>'uploads/'.$nama_foto,
'image_library'=>'gd2',
'new_image'=>'uploads/thumbnail',
'maintain_ratio'=>true,
'width'=>150,
'height'=>200
);

$this->load->library('image_lib',$config2);
$this->image_lib->resize();

}else{
$data_buku = array(
'judul'=>$judul,
'tebal'=>$tebal,
'penerbit'=>$penerbit
);

 } "
nah jadi saya akan jelasin secara singkat ya, sebelumnya kalo temen-temen bingung harap pelajari dulu materi "if else php" jadi script panjang tersebut berfungsi mendeteksi apakah ada foto atau file yang di upload.

 Apabila ada file yang di upload maka script diatas akan melakukan aksi mengambil nama file, menyimpan data ke variable array dan membuat thumbnail dari foto yang telah di upload.

 Dan jika tidak ada foto atau file yang di upload maka script tersebut hanya akan membuat variable array yang nantinya akan di simpan di database.


3. Coba script baru kalian dengan membuka browser dan mengetik alamat "localhost/belajarci", dan jangan lupa nyalakan xampp kalian terlebih dahulu.

Ok saya kira sekian tutorial pendek kali ini, semoga bermanfaat dan berguna. Kalo kawan-kawan masih bingung silahkan coret-coret tab komentar yang berada di bawah ini dan bila kawan-kawan kurang jelas dengan potongan script di atas kalian bisa download source code nya disini, sampai ketemu di artikel selanjutnya dan salam sejahtera untuk kawan-kawan semua.

15 komentar:

  1. http://lihatcode.blogspot.com7 September 2018 pukul 16.57

    makasih pak,ilmunya sangat bermanfaat

    BalasHapus
  2. harisrizavalevi9 September 2018 pukul 23.37

    good job broo, membantu sekali

    BalasHapus
  3. Unknown22 Januari 2019 pukul 01.05

    ini kapan di eksekusi pak?

    function e($kode){
    $data_kode = array('id'=>$kode);
    $data['data_buku']=$this->M_buku->cari_data($data_kode);
    $this->load->view('edit',$data);
    }


    dan yang ini:


    function i(){
    $this->load->view('input');
    }


    Mohon penjelasannya, saya masih pemula.

    BalasHapus
    Balasan
    1. deifa satrio27 Februari 2019 pukul 21.46

      function e($kode) berfungsi untuk menampilkan halaman edit, dengan mencari data berdasarkan data $kode

      kalau function i() berfungsi untuk menampilkan halaman input, coba kawan hapus salah satu fungsi tersebut , maka halaman edit / halaman input tidak akan tampil

      Hapus
  4. Anna14 April 2019 pukul 21.41

    $foto = $this->db->get_where('tb_buku',$data_kode);

    pak maaf kalau 'tb buku', $data_kode diambil dari mana

    BalasHapus
    Balasan
    1. deifa satrio15 Juni 2019 pukul 20.03

      $data_kode itu array yang isinya $id, coba check line sebelum script yang anda tanyakan

      Hapus
  5. ma'ruf27 April 2019 pukul 21.04

    makasih om, bermanfaat sekali

    BalasHapus
  6. Unknown10 November 2019 pukul 18.40

    ok nak sama-sama

    BalasHapus
  7. Muhammad Harist Illyasa20 Agustus 2020 pukul 05.50

    Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  8. Muhammad Harist Illyasa31 Agustus 2020 pukul 07.29

    bro ketika saya tidak edit gambarnya kok gambarnya hilang tapi di databse ada itu kenapa ya bro?

    BalasHapus
  9. Opang29 Maret 2021 pukul 20.07

    pak, bagaimana kalau input edit yang lain d isi sedangkan gambar tidak d ganti. supaya gambar tersebut menggunakan data gambar yg lama bagaimana y pak?

    BalasHapus
    Balasan
    1. deifa satrio28 Juni 2021 pukul 20.43

      di tambah if else, di cek dulu apakah ada file image yang di kirim atau tidak, kalo tidak di update biasa, kalo ada di unlink image lama lalu di update dengan image baru

      Hapus
  10. deifa satrio28 Juni 2021 pukul 20.42

    path nya mungkin salah

    BalasHapus

Langganan: Posting Komentar (Atom)