Skip to content

Components

Andrey Kharanenka edited this page Oct 21, 2018 · 3 revisions

Components

  1. Pagination

Pagination

The component is used to get a list of pagination buttons and provides flexible settings. The component uses oc-pagination package.

Method List

getPageFromRequest()

The method allows you to get the current page number, if you send the page number as a request parameter with the ‘page’ key.

getCountPerPage()

The method allows you to get the number of elements on a page from components settings. You can change the value specified in component settings if you send "limit" parameter in request.

getMaxPage($iCount)

  • iCount - available count of elements

The method allows you to get the number of the last page. It is used to display the “Show More” button.

{% set iPage = Pagination.getPageFromRequest() %}
{% set iCount = ElementCollection.make().active().count() %}
{% set iMaxPage = Pagination.getMaxPage(iCount) %}

{% if iMaxPage > iPage %}
    <a>Show more</a>
{% endif %}

getCountForNextPage($iPage, $iCount)

  • iPage - the current page number
  • iCount - available count of elements

The method allows you to get the count of elements for next page. It is used to display the “Show More” button.

{% set iPage = Pagination.getPageFromRequest() %}
{% set iCount = ElementCollection.make().active().count() %}
{% set iNextPageCount = Pagination.getCountForNextPage(iPage, iCount) %}

{% if iNextPageCount > 0 %}
    <a>Show more</a>
{% endif %}

get($iPage, $iCount)

  • iPage - the current page number
  • iCount - available count of elements

The method get allows you to get the array of buttons to display the navigation (example).

{% set iPage = Pagination.getPageFromRequest() %}
{% set iCount = ElementList.count() %}
{% set arPaginationList = Pagination.get(iPage, iCount) %}

{% if arPaginationList is not empty %}
    {% for arPagination in arPaginationList %}
        <a href="/{{ arPagination.value }}" class="{{ arPagination.class }}">{{ arPagination.name }}</a>
    {% endfor %}
{% endif %}