Ahammed Navas K
Ahammed Navas K

Reputation: 5

Adding Zero Before Number + jQuery Pagination

Is there any way to add "0" before the pagination number? now out put showing 1 2 3 4. I want to show like 01 02 03 04 05

<div id="pagination-container"></div>


<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/simplePagination.js/1.6/jquery.simplePagination.js'></script>
 var items = $(".list-wrapper .list-item");
    var numItems = items.length;
    var perPage = 5;
    var nnn = 0;
    items.slice(perPage).hide();

    if( numItems > 5 ){
    $('#pagination-container').pagination({
        items: numItems,
        itemsOnPage: perPage,
        prevText: '<img src="<?php echo get_stylesheet_directory_uri();?>/assets/images/page-left-arrow.svg" alt="">',
        nextText: '<img src="<?php echo get_stylesheet_directory_uri();?>/assets/images/page-right-arrow.svg" alt="">',
        onPageClick: function (pageNumber) {
            var showFrom = perPage * (pageNumber - 1);
            var showTo = showFrom + perPage;
            items.hide().slice(showFrom, showTo).show();
            $('html,body').animate({
                          scrollTop: jQuery(".regulatory-block").offset().top - 150

                        }, 500);
        }
    });
}   

Upvotes: 0

Views: 100

Answers (1)

fdomn-m
fdomn-m

Reputation: 28621

Using jquery.simplePagination.js

https://flaviusmatis.github.io/simplePagination.js/

The pagelink is generated with this code:

$link = $('<a href="' + o.hrefTextPrefix + (pageIndex + 1) + o.hrefTextSuffix + '" class="page-link">' 
        + (options.text) 
        + '</a>')

where options.text is:

options = $.extend({
                text: pageIndex + 1,
                classes: ''
            }, opts || {});

given the +1 the text will be numeric unless overwritten for next/prev buttons. For numeric (not next/prev) links, the method that builds the page-button is called with:

methods._appendItem.call(this, i);

with no option to pass in a formatter or additional opts or callback.

So, out of the box, using the CDN, the answer to:

Is there any way to add "0" before the pagination number?

is: No, not using this plugin as it is.


If you're ok copying the jquery.simplePagination.js to your site/server and linking to it there instead of from the CDN, you can change the rendering of the page number, eg from:

' + (options.text) + '

to

' + (options.text+"").padStart(2, "0") + '

note, this also applies a few lines above for the "current" page

Upvotes: 0

Related Questions