How bootstrap.widgets.TbGridView pagination can be changed as the image pasted below? - yii

Question

My widget is:-
$this->widget('bootstrap.widgets.TbGridView',array(
'type'=>'striped bordered condensed',
'id'=>'accounts-grid',
'dataProvider'=>$model->search(),
'columns'=>array(
array(
'name'=>'id',
'header'=>'ID',
'type'=>'raw',
'value'=>'$data->id',
'htmlOptions'=>array('width'=>'40'),
'url'=>'Yii::app()->createUrl("/meetings/view", array("id"=>$data["id"]))',
),
'name',
'phone',
'mobile',
'type',
'account_manager',
'status',
array(
'class'=>'bootstrap.widgets.TbButtonColumn',
),
),
));
And I need this type of pagination for this widget.
Please help me if you have any ideas.

Answer 1

Create a php file CustomPager.php and put it into components folder
<?php
class CustomPager extends CLinkPager {
/**
* #var string the text shown before page buttons. Defaults to ''.
*/
public $header = '';
/**
* #var string the URL of the CSS file used by this pager.
* Defaults to false, meaning that no CSS will be included.
*/
public $cssFile = false;
/**
* #var boolean whether to display the first and last items.
*/
public $displayFirstAndLast = false;
/**
* Initializes the pager by setting some default property values.
*/
public function init() {
if ($this->nextPageLabel === null)
$this->nextPageLabel = Yii::t('bootstrap', 'Next') . ' →';
if ($this->prevPageLabel === null)
$this->prevPageLabel = '← ' . Yii::t('bootstrap', 'Previous');
if ($this->firstPageLabel === null)
$this->firstPageLabel = Yii::t('bootstrap', 'First');
if ($this->lastPageLabel === null)
$this->lastPageLabel = Yii::t('bootstrap', 'Last');
if (!isset($this->htmlOptions['class']))
$this->htmlOptions['class'] = ''; // would default to yiiPager
parent::init();
}
/**
* Creates the page buttons.
* #return array a list of page buttons (in HTML code).
*/
protected function createPageButtons() {
$totalpages = $this->getPageCount();
if (($pageCount = $this->getPageCount()) <= 1)
return array();
list ($beginPage, $endPage) = $this->getPageRange();
$currentPage = $this->getCurrentPage(false); // currentPage is calculated in getPageRange()
$buttons = array();
/**
* first page
*/
if ($this->displayFirstAndLast)
$buttons[] = $this->createPageButton($this->firstPageLabel, 0, 'first', $currentPage <= 0, false);
/**
* previous page
*/
if (($page = $currentPage - 1) < 0)
$page = 0;
$buttons[] = $this->createPageButton($this->prevPageLabel, $page, 'previous', $currentPage <= 0, false);
/**
* internal page
*/
$buttons[] = '<li class=""><a herf="">Current Page: '.($currentPage+1).' of ' . $totalpages .' </a><li>';
/**
* next page
*/
if (($page = $currentPage + 1) >= $pageCount - 1)
$page = $pageCount - 1;
$buttons[] = $this->createPageButton($this->nextPageLabel, $page, 'next', $currentPage >= ($pageCount - 1), false);
/**
* last page
*/
if ($this->displayFirstAndLast)
$buttons[] = $this->createPageButton($this->lastPageLabel, $pageCount - 1, 'last', $currentPage >= ($pageCount - 1), false);
return $buttons;
}
/**
* Creates a page button.
* You may override this method to customize the page buttons.
* #param string $label the text label for the button
* #param integer $page the page number
* #param string $class the CSS class for the page button. This could be 'page', 'first', 'last', 'next' or 'previous'.
* #param boolean $hidden whether this page button is visible
* #param boolean $selected whether this page button is selected
* #return string the generated button
*/
protected function createPageButton($label, $page, $class, $hidden, $selected) {
if ($hidden || $selected)
$class .= ' ' . ($hidden ? 'disabled' : 'active');
return CHtml::tag('li', array('class' => $class), CHtml::link($label, $this->createPageUrl($page)));
}
}
?>
and call class from widget grid view
'pager'=>array(
'class'=>'CustomPager',
),