Setelah kita membicarakan pemakaian Bootstrap pada form Yii1 (http://www.proweb.co.id/articles/web_application/form_bootstrap_yii1.html), kita akan menggunakan Bootstrap untuk CGridView Yii 1.
Seting yang penting dalam menggunakan memasukkan bootstrap ke CGridView adalah:
- Property itemsCssClass untuk table dan pagerCssClass untuk paging
Kita dapat memasukkan source misalnya:
$this->widget(‘zii.widgets.grid.CGridView’, array(
‘id’=>’tbl-user-grid’,
‘itemsCssClass’ => ‘table table-hover’,
‘pagerCssClass’=>’pagination’,
‘ajaxUpdate’=>false,
‘dataProvider’=>$model->search(),
‘filter’=>$model,
‘columns’=>array(
‘username’,
‘fullname’,
array(
‘class’=>’CButtonColumn’,
),
),
));Untuk table headernya kita membuat css sendiri misal pss.css dan masukkan dengan tag link dalam layouts/main.php
Misal pss.css :
.table th
{
background-color: #efefef;
text-align: center;
}
Contoh tampilan yang dihasilkan seperti gambar berikut ini:
Informasi lebih lanjut silahkan mengunjungi:
1. http://www.yiiframework.com/doc/api/1.1/CGridView .
2. http://getbootstrap.com/css/#tables .
Kunjungi www.proweb.co.id untuk menambah wawasan anda.
Menggunakan bootstrap pada CGridView Yii 1