FFCMS Wiki

Официальная документация разработчика и администратора

Инструменты пользователя

Инструменты сайта


helper:html:pagination

Простая пагинация

Нередко при реализации приложений, в которых используется динамическое отображение списка элементов потребуется выводить элементы списка постранично. Для простого отображения элементов пагинации (постраничного вывода) в ffcms существует помощник «простая пагинация» (en. Simple Pagination).

Класс SimplePagination содержит конструктор и единственный публичный метод - display() для отображения сгенерированного html-кода пагинации.

Пагинация генерируется как ненумерованный список, формата ul>li{n} с возможностью задать класс, id и другие атрибуты для корневого ul тега.

Введение в использование

Для генерации html-каркаса элемента пагинации первоначально необходимо объявить экземпляр класса и передать ему некоторые параметры в виде массива, такие как номер текущей страницы, общее количество элементов, количество элементов на страницу а так же корневой url, используемый при генерации ссылок. Рассмотрим пример:

use Ffcms\Core\Helper\HTML\SimplePagination;
$pagination = new SimplePagination([
    'url' => ['demo/index'],
    'page' => 0, // current page index
    'step' => 10, // offset elements per page
    'total' => 1000 // total elements count
]);

После чего мы сможем отобразить сгенерированный код:

echo $pagination->display(['id' => 'myPagination', 'class' => 'pagination-main']);

Сгенерированный код будет выглядеть примерно следующим образом:

<ul id="myPagination" class="pagination-main">
    <li><a href="https://ffcms.org/ru/demo/index">1</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=1">2</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=2">3</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=3">4</a></li>
    <li class="disabled"><a href="#">...</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=50">51</a></li>
    <li class="disabled"><a href="#">...</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=96">97</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=97">98</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=98">99</a></li>
    <li><a href="https://ffcms.org/ru/demo/index?page=99">100</a></li>
</ul>

Динамическая генерация

Продемонстрированный выше пример является вполне достаточным для опытного разработчика и является исчерпывающим руководством к применению. Однако, для новичков мы приведем пример динамической генерации пагинации для элементов таблицы базы данных.

Допустим, что у нас имеется таблица prefix_demo, которая содержит много строк различных данных. Так как данных очень много, то отображать их на одной странице достаточно накладно, а в случае если используется зависимость к другой таблице и хотя-бы еще один запрос - мы гарантированно создадим сильную нагрузку на базу данных. Для работы с таблицей мы используем активную запись Demo. Предположим что изначально наш код выглядит так:

use Apps/ActiveRecord/Demo as DemoRecords;
use Extend\Core\Arch\FrontAppController;
use Ffcms\Core\Helper\HTML\SimplePagination;
 
class Data extends FrontAppController
{
    public function list()
    {
        // get data from db
        $records = DemoRecords::where('display', true)->get();
 
        // render view to display
        return $this->view->render('demo/list', [
            'records' => $records
        ]);
    }
}

Для того, чтобы разбить данные на странице мы будем использовать SimplePagination:

use Apps/ActiveRecord/Demo as DemoRecords;
use Extend\Core\Arch\FrontAppController;
 
 
class Data extends FrontAppController
{
    const ELEMENTS_PER_PAGE = 10; // define global const for elements offset per page
 
    public function list()
    {
        // get page index
        $page = (int)App::$Request->query->get('page', 0);
        // get data from db
        $query = DemoRecords::where('display', true);
        // get total rows count
        $count = $query->count();
        // calculate offset
        $offset = $count * static::ELEMENTS_PER_PAGE;
 
        // initialize pagination with action params
        $pagination = new SimplePagination([
            'url' => ['demo/list'],
            'page' => $page,
            'step' => static::ELEMENTS_PER_PAGE,
            'total' => $count
        ]);
 
        // fetch records to result object
        $records = $query->skip($offset)->take(static::ELEMENTS_PER_PAGE)->get();
 
        // render view to display
        return $this->view->render('demo/list', [
            'records' => $records,
            'pagination' => $pagination
        ]);
    }
}

Давайте рассмотрим внесенные изменения. Для начала мы получили текущий индекс страницы $page, изменили запрос не доводя его до fetch result (→get()), посчитали количество строк в базе $count и вычислили $offset для текущей страницы. После мы инициировали экземпляр объекта пагинации $pagination со всеми вычисленными параметрами и выполнили запрос в бд получил результат в переменную $records. После всего этого мы передали экземпляр объекта пагинации на рендеринг представления.

Для отображения элемента пагинации нам осталось лишь добавить в шаблон представления default/demo/list.php:

<?= $pagination->display() ?>

Bootstrap стили для пагинации

Пример приведенный выше является вполне работоспособным но нуждается в стилях для корректного отображения. Чтобы не изобретать велосипед не создавать собственные стили для отображения элементов пагинации мы можем использовать готовые стили bootstrap pagination, слегка изменив вызов метода display():

<?= $pagination->display(['class' => 'pagination pagination-centered']) ?>

а так же отобразить пагинацию по центру страницы:

<div class="text-center">
    <?= $pagination->display(['class' => 'pagination pagination-centered']) ?>
</div>
helper/html/pagination.txt · Последние изменения: 2017/01/02 15:46 (внешнее изменение)