Skip to content

Customize the Pagination Info

Rati Wannapanop edited this page Jul 30, 2016 · 3 revisions

By default, the pagination information displays the text "Displaying {from} to {to} of {total} items" where the information inside the curly bracket get replaced by the pagination information returned from the server, which are

  • {from} the starting record shown
  • {to} the end of the record shown, and
  • {total} the total number of records available

You can replace the text with whatever you want or text in other languagues. If the {from}, {to}, and {total} are included, they will be replaced with the appropriate number in-place accordingly.

    <vue-table
        api-url=""
        :fields=""
        :sort-order""
        :pagination-info-template="Showing: {from} - {to} out of {total} records"
        pagination-info-no-data-template="The requested query return no result"
    ></vue-table>

When the total number of record is zero, vuetable will display text defined in pagination-info-no-data-template prop, which is default to "No relevant data".