Anda di halaman 1dari 3

Extensi Yii untuk Hierarki Header CGridView

Oleh: Muhammad Farid Fadhlan


CGridView sebagai salah satu widget Yii memiliki banyak fitur. Dari paging
hingga sorting bisa memanjakan programmer web menyediakan data tabel.
Namun dari sekian fitur tersebut, kadang-kadang ada permintaan dari user
untuk mengcustom. Memang benar, sudah banyak ekstensi-ekstensi Yii
untuk keperluan itu, namun tentu tidak semua tercover. Salah satu project
yang sedang saya buat, user meminta u...
CGridView sebagai salah satu widget Yii memiliki banyak fitur. Dari paging hingga sorting bisa
memanjakan programmer web menyediakan data tabel. Namun dari sekian fitur tersebut,
kadang-kadang ada permintaan dari user untuk mengcustom. Memang benar, sudah banyak
ekstensi-ekstensi Yii untuk keperluan itu, namun tentu tidak semua tercover.
Salah satu project yang sedang saya buat, user meminta untuk membuat grouping header. Misalkan
untuk kolom Rupiah dan kolom Dolar, dibuat parent header dengan nama Harga yang tampilannya
kurang lebih seperti ini.
Setelah mencoba mencari-cari grouping header di extensi Yii, ternyata hasilnya nihil. Memang ada
ekstensi GroupGridView, tapi fungsinya untuk menggroup nilai yg sama dari sebuah kolom, bukan
headernya.
Akhirnya, saya putuskan untuk membuat ekstensi sendiri untuk memanipulasi CGridView sehingga
dapat ditampilkan sesuai keinginan user tanpa mengurangi fitur-fitur utama dari CGridView. Setelah
algoritma selesai dibuat, saya coba implementasikan dengan membuat sebuah class
HeaderGroupGridView yang meng-extend CGridView.
Dengan menambahkan parameter mergeHeaders, kita bisa memilih header kolom mana yang akan
digroup, sehingga tampilan HeaderGroupGridView kurang lebih seperti ini.
Untuk mendefinisikannya dapat dilihat dari kode di bawah ini.
$this->widget('ext.HeaderGroupGridView', array(
'id'=>'user-grid',
'summaryText'=>'Total {count} data',
'mergeHeaders'=>array(
array(
'name'=>'Realisasi POK Satker',
'start'=>3, //indeks kolom 3
'end'=>4, //indeks kolom 4
),
array(
'name'=>'Realisasi KPPN',
'start'=>5,
'end'=>6,
),
),
'dataProvider'=>$dataProvider,
'columns'=>array(
//array kolom
),
));
Ekstensi HeaderGroupGridView bisa didownload di sini.
Untuk sementara, ekstensi ini hanya support untuk hierarki 2 level saja. Mungkin untuk versi
berikutnya akan saya perbaiki sehingga bisa multihierarki.
Semoga membantu dan happy coding
Tentang Penulis
Muhammad Farid Fadhlan