Adding Zero Before Number + jQuery Pagination

Question

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);
        }
    });
}

Use `String.prototype.padStart`: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart — Terry, Oct 11 '22 at 12:38
can you please give any examples here? that using on jquery.. or which area I want to use that function? — Ahammed Navas K, Oct 11 '22 at 12:43
i can see the duplicate answer for javascript. i want to implement the "0" in jquery pagination — Ahammed Navas K, Oct 11 '22 at 12:47
yes. but how i can implement those codes in this jquery pagination? can you please help me to do that — Ahammed Navas K, Oct 11 '22 at 12:50
This questions appears to be more about how to add leading zero **on the pagination plugin** - not just add leading zeros to a variable. — freedomn-m, Oct 11 '22 at 13:02
@AhammedNavasK exactly which pagination plugin are you using? The answer will depend on the options on the plugin. — freedomn-m, Oct 11 '22 at 13:03
am not using any plugins. just add the **jquery simple pagination** — Ahammed Navas K, Oct 11 '22 at 13:07
[tag:jquery] does not come with "simple pagination" - there's no `$(..).pagination()` method in *jquery*. Can you at least provide a link to where you downloaded it? The documentation? Maybe [edit] your question to include your ` — freedomn-m, Oct 11 '22 at 13:15

freedomn-m · Accepted Answer · 2022-10-11T13:45:12.557

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

Always consider than answers on SO may have typos - there was an extra `;` - removed, see edit. — freedomn-m, Oct 11 '22 at 13:46

Adding Zero Before Number + jQuery Pagination

1 Answers1