CLinkPager page links + ajax

It would be very helpful if the CLinkPager rendered the next and previous links (and the first and last page links) even if they were not meant to be visible (previous should not be visible on page one), and if the next, previous, first and last links all had a default css class. This would make it easier with jQuery to add ajax to the pager without the pager needing to be modified to support it - the javascript code can simply toggle the display:none when needed.

I've hacked on the CLinkPager class a bit. Changing the code in run() which adds the buttons to this:

		if ($this->showFirstPageButton)












… and changing createPageButton() to this:

	protected function createPageButton($label,$page,$currentPage,$class="",$visible=true)



		if (!empty($class))

			$options["class"] = $class;

		if (!$visible)

			$options["style"] = "display:none;";


			return CHtml::tag("span", $options, $label);


			return CHtml::tag("span", $options, CHtml::link($label,$this->createPageUrl($page)));


… allows me to do this. Can this functionality be incorporated?

Your suggestion is very reasonable. I will add it. Thank you very much.

That was quick! It's checked in already!

Two things I noticed though - CLinkPager->showLastPageButton is no longer checked before the last page button is added, and the current page is not rendered as a link, which overcomplicates the javascript i need to write a bit - i have to wrap the element in a link tag if i change away from the current page. Is it possible to make the current link just a class instead? So it's still clickable, but in the CSS it can be styled differently?

I just fixed the first problem.

For the second, I agree with you that using a link with a css is more convenient. However, the goal is that the pager should work without requiring any additional CSS. Do you have any idea to achieve this goal?

It seems to me that if the current page is a link the pager still works, it just doesn't offer an adequate indicator of what the current page is.

What if the pager displayed a "Page 2 of 3" bit of text as well, with spans around the 2 and the 3 to ease js updating? That way the current page number could stay as a link without compromising the usability.

Page 2 of 3 << First < Prev 1 2 3 Next >> Last >>

The '2' link could still have a default CSS class, but it's not a problem if it isn't actually styled because the current page is indicated by the "Page x of y" bit.

What about this? Would this make js easy? If so, I can refactor CLinkPager and let it to publish a CSS asset file.

Sorry, I'm not quite sure what you mean. Thanks for the quick replies though!

Ah, forget to post the link. http://woork.blogspo…-using-css.html

The idea is to use <ul> and <li> to organize the links, and display all links (including first, last, prev, next, pages), use CSS to control their visibility and appearance. The pager will publish a CSS file to do default styling.

That's a really good idea. The CSS asset can function as a good example of what styling is possible and provide a nice looking default. Will the asset be able to be deactivated? Everything will be a link though? Cos on that site, the active page is not marked up as a link.

Yes, everything will be a link (so it is not exactly like that site).

And first, last, prev, next links will all be generated. We will use CSS to control their visibility.

And yes, CSS can be turned off.

Ok, the work is done. Could you please take a look to see if it fits your need now? Thanks.

about this CLinkPager

this is workins? need same custom code for work?

I am traying the crud generate from yii but I can not see this:

<< First < Prev 1 2 3 Next >> Last >>

only this:

<< Prev 1 2 3 Next >>

what we need do  it?



You need to override the existing CSS styles for those buttons. The default one is:

ul.yiiPager .first,

ul.yiiPager .last




hi, ok

in /asset I can see the file after change work fine, but is this the correct location for ovewride?


No. You should not touch anything under assets as they may be overwritten automatically. You can include your CSS files to your pages.


is possible that you give me an code example for clinkpager + ajax

and excuse me for may english