Displaying data with pagination using custom HTML and CSS - php

Question

Let's say I have a model that represents products in a catalog. The model supplies the content provider (CActiveDataProvider) to the view, which in turn uses it to display a grid (CGridView).
What I need is a custom way to display this data: custom next/previous page links, custom data presentation. Something along these lines:
<div class="pagination">
<a class="arrows prev fl" href="#"><span class="icon"></span>back</a>
<a class="arrows next fr" href="#">forward <span class="icon"></span></a>
</div>
<ul class="some class">
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
<li class="item"><img src="image.jpg" width="100" height="200"/></li>
</ul>
What is the best way to do this? So far, I am considering the following:
Use CGridView, but somehow customize its output using parameters.
Create a class as a descendant of CGridView or even CBaseListView and put in the formatting logic in it.
Just do it the quick and dirty way: simply iterate over items and echo the HTML.
Or maybe I am missing something here and there's a better way?

Answer 1

Bootstrap is good for displaying tabular data. I use Yii with Bootstrap to generate my own data display, simply because I don't like Yii's CGridView, even though it's convenient.
Your controller function might look something like this:
public function actionList($offset=0){
$model = new CatalogModel;
$data = $model->listCatalogsItems($offset);
$this->render('list',array(
'model'=>$data,
));
}
and your model like this
public function listCatalogItems($offset=0) {
$query = SELECT *
FROM catalog
WHERE <your conditions here> LIMIT 10 OFFSET " . $offset;
$items = Yii::app()->db->createCommand($query)
->queryAll();
return $items;
}
So with your next / previous page buttons, pass the OFFSET as a value in the url, ex http://yoursite.com/site/action/2
Hope that makes sense.

Answer 2

I ended up creating my own class to display this data as a descendant of CWidget class.
All the logic went into the run method.