Log Of Oyazhuryachna

Membuat PopUp dengan URL Helper di CodeIgniter

Sebelum ditemukannya jquery dan bootsrtrap, popup merupakan teknologi pendahulunya. membuat popup jika menggunakan bootstrap istilahnya adalah modal dialog dan untuk membuatnya silahkan baca artikel membuat modal dialog pada artikel Membuat Output PDF dengan CodeIgniter Menggunkan Modal Dialog.

Perhatikan screenshoot berikut, ketika icon buku disebelah kanan di-klik maka akan menjalankan popup menampilkan detail dari buku yang bersangkutan.

popup_1

 

Berikut tampilan popup-nya:

popup_2

Popup tidak hanya berguna untuk menampilkan data seperti diatas, namun bisa juga menampilkan data untuk diambil nilainya dan dikirim ke form yang dituju, sebagai contoh ketika tombol tambah diklik maka akan tampak seperti berikut :

popup_3

Pada gambar diatas perhatikan pada bagian penerbit dan pengarang, jika kita menggunakan dropdown biasa tidak menjadi masalah ketika data penerbit atau pengarangnya sedikit, namun akan jadi masalah ketika datanya banyak maka dropdown akan memanjang kebawah nah mengakalinya dengan membuat popup, sebagai contoh ketika tombol cari pada bagian pengarang di klik akan menjalankan popup berikut :

popup_4

 

Perhatikan gambar diatas, bisa diatur menggunakan paging / pemenggalan halaman, dan ketika di-klik kode pengarangnya, otomatis kode dan nama pengarang akan dibawah ke kotak kode dan nama pengarang pada form tambah buku diatas.

Penasaran membuatnya ?? berikut langkah garis besarnya :

1. Load helper URL di autoload.php pada folder application config

autoload[‘helper’]=array(‘url’);

2. buat class dalam hal ini misal class popup

3. buat fungsi-fungsi di dalam class popup , satu fungsi untuk satu popup, misal

public function penerbit(){

kode php

}

untuk menampilkan popup daftar penerbit

4. buat view, pada bagian atas view buat atribut berupa array untuk menyiapkan setting popup

popup_5

5. pada view yang akan menggunakan popup untuk menjalankan popupnya dengan mengetikan syntax

anchor_popup(alamat_url_popup,text_link,atribut_popup);

misal :

popup_7

6. Sedangkan untuk mengambil nilai ketika sebuah link didalam popup di klik berikut potongan scriptnya :

popup_6

Untuk jelasnya silahkan download full script nya pada link dbawah ini.

DOWNLOAD VIA GOOGLE DRIVE

2 thoughts on “Membuat PopUp dengan URL Helper di CodeIgniter

Leave a Reply

Your email address will not be published. Required fields are marked *