CGridView change appearance after Ajax call

Yii 1.1 General Discussion
1

Hi All,

I recently asked a question whether it’s possible to have an alternative to the standard pagination provided by CGridView: http://www.yiiframework.com/forum/index.php?/topic/13096-ziiwidgetsgridcgridview-is-there-an-alternative-to-pagination

I was wondering if it’s possible to change it back to pagination after this ajax request? Currently I remove grid header (displaying records 1-10 of 100) and pagination at the bottom using


'template'=>"{items}"

Thanks!

2

I don’t understand what you are trying to do

In general, you can check if you are in an ajaxRequest via Yii::app()->request->isAjaxRequest.

In principle, you can:




'template'=>(Yii::app()->request->isAjaxRequest)?'alt.template':'{items}'
3

Thanks zaccaria, it works great, I didn’t know about this feature! There is only one minor issue - if pager is hidden when page first loads, style sheet of it isn’t included in the page HEAD section, so pager oesn’t look nice…


<link rel="stylesheet" type="text/css" href="/assets/e02ebdd/pager.css" />

What would be the most elegant way to include this file all the time?

Also, I would like to change link text and content after clicking. I tried the following approach but it didn’t work:


if ($viewAll == 0) // $viewAll is set in corresponding controller and get changed after clicking the link to 1.

echo CHtml::link(

        "View All", ...

);

else 

echo CHtml::link(

        "Hide All", ..

);

Thanks!

4

I am happy that you solved the first issue, even thought that I still didn’t get what are you doing.

About include the css, you should do something like:


<?php Yii::app()->clientScript->registerCssFile(Yii::app()->assetManager->publish(Yii::getPathOfAlias('system.web.widgets.pagers.pager').'.css'));?>

About the second question I didn’t get…

5

Thanks! This worked without any changes.

In the second question I would like to change some code outside of CGridView after ajax call.

Currently I have the following link outside of my CGridView:


echo CHtml::link(

        "View All",

        '',

        array('onClick'=>"$.fn.yiiGridView.update('links',{ data:{view_all: 1 }})",

              'style'=>"cursor:pointer;"

	    )

);

In the controller I check view_all param and make some changes to the CGridView control, for example change pageSize of pagination property from 25 to 100.

This works great, but I can’t find a solution to change this “View all” link to “Hide all” right after clicking, so I could click this “Hide all” link and apply all original settings. After that “View link” will become available again.

I hope this clarifies it, but I can explain in more detail if necessary.

Thanks!

6

This looks like an hard task…

You can try to do in in the function afterAjaxUpdate of CGridView:




$this->widget('zii.widget.cgridview'

'afterAjaxUpdate'=>'js:function(id, data){$("#showAll").html("Hide All")}'
7

I also need to change the value of param view_all to 0, so looks like it won’t work…