Columns for CListView

В составе лучшего PHP фреймворка в мире – Yii есть класс для отображения списка элементов – CListView. К сожалению он не отображает список в несколько колонок, для одного из моих проектов понадобилось именно это.

Представляю ColumnListView

columns))
			foreach ($this->columns as $column)
			{			
				echo CHtml::openTag('div',array('class'=>'column '.$column,))."\n";
				$columns = sizeof($this->columns);
				
				$data=$this->dataProvider->getData();
				if(count($data)>0)
				{
					$owner=$this->getOwner();
					$render=$owner instanceof CController ? 'renderPartial' : 'render';
					foreach($data as $i=>$item)
					{	
						if( ($i+ ($columns - $y)) % $columns == 0)
						{
							$data=$this->viewData;
							$data['index']=$i;
							$data['data']=$item;
							$data['widget']=$this;
							$owner->$render($this->itemView,$data);
						}
					}
				}
				else
					$this->renderEmptyText();
				echo CHtml::closeTag('div');
				$y++;
			}	
	}
	
}

Использование:

Скопируйте файл ColumnListView.php в папку protected/components.

В том месте где нужно вывести список должен выполнится примерно такой код:


widget('application.components.ColumnListView', array(
		'dataProvider'=>$dataProvider,
		'itemView'=>'_view',
		'columns'=>array("one","two","three","four"),
	)); ?>

Все наши элементы будут выведены в четырех колонках.
Обратите внимание, добавился новый параметр columns – массив, каждый элемент которого это див с одноименным классом. Правильное отображение этих дивов вам нужно обеспечить самостоятельно.

ColumnListView.php

5 thoughts on “Columns for CListView”

  1. Each column has it’s own css class. You can specify collumn width in CSS file

    .one{width:300px; float:left}
    ...

  2. good stuff. new to yii & Google Translate helps me with the language, how about the pagination as CGridView does?

  3. Мои замечания:
    1. Замечательный класс!
    2. Полезно:
    2.1. По аналогии с рекомендацией Админа:
    .one{width:33%; float:left}
    при выводе в 3 колонки, при выводе в 4 колонки- 24% и т.д.
    2.2. При выводе в 3-4 часто ломается верстка пагинатора в случае многостраничных списков и неполной последней строки. Пагинатор начинает дополнять последнюю строку, не вмещается- получается “бяка”. Рецепт: Найти файл styles.css (CListView) в соответствующей подпапке паки assets и дополнить класс “.list-view .pager” строкой (я ее вставил в начало): clear: both; .

Leave a Reply

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