Skip to content
Matthew McNaney edited this page Jul 30, 2013 · 23 revisions

There are two sides to Pager: the display and the feed. The display occurs in your controller's HTML view.

    public function getHtmlView($data, \Request $request)
    {
        \Pager::prepare();
        $template = new \Template;
        $template->setModuleTemplate('your_module', 'templateSubDirectory/Pager_Template_file.html');
        return $template;
    }

The prepare function just includes the pager javascript. Your html template should look like the following:

<div class="pager-listing" id="pet-list" data-rpp="10">
    <div style="text-align:right" class="pager-search"></div>
    <table class="table table-striped">
        <thead class="pager-head">
            <tr>
                <th class="pager-header animal"></th>
                <th class="pager-header name"></th>
                <th class="pager-header color"></th>
            </tr>
        </thead>
        <tbody class="pager-body">
            <tr class="pager-row">
                <td class="pager-column animal"></td>
                <td class="pager-column name"></td>
                <td class="pager-column color"></td>
            </tr>
        </tbody>
    </table>
    <div class="pagination pagination-centered"></div>
</div>

Make sure you have a block node (like <div>) surrounding your pager html. This block MUST have a distinct id and the class "pager-listing". The data field (data-rpp="10") indicates how many "rows per page" should be shown.

In this example, the next required node is "pager-search." This will create a search box for the pager. The last UI requirement is near the bottom. The "pagination" class node will contain a listing of pages the user can navigate through.

Sorting the columns of information occurs in "pager-header" class node. Make sure each header contains that class AND, very important, the name of the column the header will sort.

Finally, the rows themselves appear in the "pager-row" by using the "pager-column" nodes. Again, it is important the at the column names appear as classes in the pager-column. You only need to give a single example row. The Pager will use it as a stamp for the remaining rows.

Clone this wiki locally