Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how do I replace the text "rows" in pagination

In the pagination example, how do I replace the text at the bottom, "rows" with another word e.g. "products"?

Showing 1 to 10 of 800 rows

becomes

Showing 1 to 10 of 800 products

Ported from issue # 882 on bootstrap-table's issue tracker.

like image 628
jtrumbull Avatar asked Sep 01 '25 18:09

jtrumbull


1 Answers

This text is part of bootstrap-table's localizations. English (en-US) is loaded by default.

Solution # 1 Create and include a custom locale

/js/locale/bootstrap-table-en-US-custom.js

(function ($) {
    'use strict';

    $.fn.bootstrapTable.locales['en-US-custom'] = {
        formatLoadingMessage: function () {
            return 'Hold your horses...';
        },
        formatRecordsPerPage: function (pageNumber) {
            return pageNumber + ' bananas per page';
        },
        formatShowingRows: function (pageFrom, pageTo, totalRows) {
            return 'Showing ' + pageFrom + ' to ' + pageTo + ' of ' + totalRows + ' products';
        },
        formatSearch: function () {
            return 'Search';
        },
        formatNoMatches: function () {
            return 'No matching records found';
        },
        formatPaginationSwitch: function () {
            return 'Hide/Show pagination';
        },
        formatRefresh: function () {
            return 'Refresh';
        },
        formatToggle: function () {
            return 'Toggle';
        },
        formatColumns: function () {
            return 'Columns';
        },
        formatAllRows: function () {
            return 'All';
        }
    };

    $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales['en-US-custom']);

})(jQuery);

It is also important to note, that the localization settings get merged in to the table settings -meaning that you can simply

Solution # 2 Pass them as an argument in your table settings:

$('#table').bootstrapTable({

    // .. your other table settings

    pagination: true,

    formatShowingRows: function (pageFrom, pageTo, totalRows) {
        return 'Showing ' + pageFrom + ' to ' + pageTo + ' of ' + totalRows + ' rows';
    }

});
like image 126
jtrumbull Avatar answered Sep 07 '25 08:09

jtrumbull