Page Size Component

Overview

The Page Size component is used to modify the number of search results displayed on each page.

Selector

The selector for this component is <hawksearch-page-size>.

Data Model

The following data model is exposed to the Handlebars template:

{ options: Array<PaginationOption> }

For more information, see Pagination.

Event Binding Attributes

Attribute Name

Attribute Value

Attribute Name

Attribute Value

hawksearch-page-size

number

When a select element with this attribute changes in value, the search will be updated to use that value as the new page size.

When the page size changes, the first page will automatically be selected.

Default Template

<div class="page-size"> <select hawksearch-page-size> {{#each options}} {{#if selected}} <option value="{{pageSize}}" selected>{{title}}</option> {{else}} <option value="{{pageSize}}">{{title}}</option> {{/if}} {{/each}} </select> </div>