February 24, 2016

Modal bootstrap pada Yii2

Share this
  •  
  •  
  •  
  •  
  •  
  •  

Assalamualaikum wr wb, pada topik kali ini saya akan menulis tentang cara penggunaan modal bootstrap pada Yii2 Framework. Seperti diketahui bahwa modal merupakan jendela pop up yang tampil pada halaman yang sama, saya biasanya menggunakan modal untuk menampilkan informasi atau submit sebuah form, kalau untuk penggunaan bisa menggunakan selera masing-masing. Sebenarnya inti dari penggunaan modal adalah agar aplikasi terlihat responsif dan menampilkan informasi tanpa harus pindah ke halaman yang lain, dimana hal ini terlihat merepotkan bagi end user. Selanjutnya langsung saja kita praktek pada sumber persoalan. Untuk contohnya saya akan membuat modal untuk menampilkan data informasi kategori.

Modal bootstrap pada Yii2

Terlebih dahulu kita buat fungsi menggunakan JQuery untuk menampilkan modal dan jangan lupa untuk meregister asset js nya.

Kemudian kita definisikan widget untuk memanggil modal bootstrap.

Kemudian kita buat tombol  untuk menampilkan modal, kita sesuaikan element class nya untuk memicu JQuery.

Hasilnya sebagai berikut, ketika tombol info kategori di klik maka modal akan muncul.

Modal bootstrap pada Yii2

Modal bootstrap pada Yii2

terus bagaimana jika ingin menampilkan informasi data melalui sebuah action pada controller, cukup mudah hehe. Kita buat dulu sebuah fungsi dan view untuk menampilkan data kategori menggunakan Gridview.

script untuk file frontend/views/sites/dataKategori.php

Perhatian untuk menampilkan data melalui modal, pastikan pada saat me return view menggunakan $this->renderAjax supaya view bisa tampil dalam frame modal

Sekarang kita cek lagi bagaimana script yang telah kita buat, check this out!!! 😀

Modal bootstrap pada Yii2

Modal bootstrap pada Yii2

foilahhh … !! Mudah bukan, modal sudah menampilkan data sesuai dengan action yang telah saya buat, ini sangat berguna jika anda ingin menampilkan beragam informasi dalam satu halaman yang sama. Sekian sharing dari saya mengenai modal bootstrap pada Yii2, semoga dapat bermanfaat. Terimakasih.

Agus Wiji Suhariono

Memulai menulis Blog pada bulan November dari Tahun 2015. Penulis merupakan alumni dari Politeknik Negeri Malang angkatan 2011 Program Studi Manajemen Informatika, Jurusan Elektro. Penulis memulai menekuni dunia programming mulai tahun 2014 dan sekarang bekerja di Pemerintahan sebagai IT Staff.

You may also like...