Grid View

Yii grid view with Bootstrap looks

In order to test the Grid Views we make use of the following data:

// $gridDataProvider
$mark = new Person();
$mark->id = 1;
$mark->firstName = 'Mark';
$mark->lastName = 'Otto';
$mark->language = 'CSS';
$mark->hours = 10;

$jacob = new Person();
$jacob->id = 2;
$jacob->firstName = 'Jacob';
$jacob->lastName = 'Thornton';
$jacob->language = 'JavaScript';
$jacob->hours = 20;

$stu = new Person();
$stu->id = 3;
$stu->firstName = 'Stu';
$stu->lastName = 'Dent';
$stu->language = 'HTML';
$stu->hours = 10;

$persons = array($mark, $jacob, $stu);

$gridDataProvider = new CArrayDataProvider($persons);

// $gridColumns
$gridColumns = array(
	array('name'=>'id', 'header'=>'#', 'htmlOptions'=>array('style'=>'width: 60px')),
	array('name'=>'firstName', 'header'=>'First name'),
	array('name'=>'lastName', 'header'=>'Last name'),
	array('name'=>'language', 'header'=>'Language'),
	array('name'=>'hours', 'header'=>'Hours worked'),
	array(
		'htmlOptions' => array('nowrap'=>'nowrap'),
		'class'=>'booster.widgets.TbButtonColumn',
		'viewButtonUrl'=>null,
		'updateButtonUrl'=>null,
		'deleteButtonUrl'=>null,
	)
);

$person = new Person();

Basic example of usage is this:

#First nameLast nameLanguageHours worked 
1MarkOttoCSS10
2JacobThorntonJavaScript20
3StuDentHTML10
$this->widget(
    'booster.widgets.TbGridView',
    array(
        'dataProvider' => $gridDataProvider,
        'template' => "{items}",
        'columns' => $gridColumns,
    )
);

Here's all configuration properties which you can set for TbEditableView widget.

Property Description
type name = default description

Striped

#First nameLast nameLanguageHours worked 
1MarkOttoCSS10
2JacobThorntonJavaScript20
3StuDentHTML10
$this->widget(
    'booster.widgets.TbGridView',
    array(
        'type' => 'striped',
        'dataProvider' => $gridDataProvider,
        'template' => "{items}",
        'columns' => $gridColumns,
    )
);

Bordered

#First nameLast nameLanguageHours worked 
1MarkOttoCSS10
2JacobThorntonJavaScript20
3StuDentHTML10
$this->widget(
    'booster.widgets.TbGridView',
    array(
        'type' => 'bordered',
        'dataProvider' => $gridDataProvider,
        'template' => "{items}",
        'columns' => $gridColumns,
    )
);

Condensed

#First nameLast nameLanguageHours worked 
1MarkOttoCSS10
2JacobThorntonJavaScript20
3StuDentHTML10
$this->widget('booster.widgets.TbGridView', array(
        'type' => 'condensed',
        'dataProvider' => $gridDataProvider,
        'template' => "{items}",
        'columns' => $gridColumns,
    ));

Striped, bordered and condensed

#First nameLast nameLanguageHours worked 
 
1MarkOttoCSS10
2JacobThorntonJavaScript20
3StuDentHTML10
$this->widget('booster.widgets.TbGridView', array(
        'type' => 'striped bordered condensed',
        'dataProvider' => $gridDataProvider,
        'template' => "{items}",
        'filter' => $person->search(),
        'columns' => $gridColumns,
    ));