YiiBooster TbGridView – First and Last Page Link

30. April 2014 Blog 1

I basically always have YiiBooster installed on every Yii site I have worked on. One thing I could never get to work right was on a TbGridView, which extends the CGridView class, is the First and Last page links on the pagination. Like this:

pager

I finally took the time to dig into the code and was able to get to work correctly here is how you do it:

$this->widget('bootstrap.widgets.TbGridView',array(
   'id'=>'user-grid',
   'dataProvider'=>$model->search(),
   'filter'=>null,
   'columns'=>$columns,
   'pager' => array(
      'class' => 'bootstrap.widgets.TbPager',
      'displayFirstAndLast' => true,
   ),
));

You can ignore most of that the main thing you have to worry about is specifying the ‘pager’ class and setting the displayFirstAndLast option to true. If someone knows of a better way please let me know but this works correctly for now. One other thing I have done on most of my TbGridViews is make it so that it scrolls back to the top of the list when you go to a new page. Just add this javascript with registerScript or you can add it directly to the HTML if you would rather do that:

Yii::app()->clientScript->registerScript('scroll', "
   $(document).on('click','.yiiPager li a',function() {
      $('html, body').animate({scrollTop:$('#user-grid').offset().top - 20}, 'slow');
   });
");

You just need to make sure the id you specified in the array for the TbGridView settings matches the id you specify in the jquery. In my example you will see in both places the id is ‘user-grid’.


1 thought on “YiiBooster TbGridView – First and Last Page Link”

  • 1
    bhavana on June 19, 2014 Reply

    Thanks for providing such a great information YIIBOOSTER TBGRIDVIEW IN Yii Development.

Leave a Reply to bhavana Cancel reply

Your email address will not be published. Required fields are marked *