jQuery UI spinner string format

2.6k Views Asked by At

this fiddle shows hours/minutes/seconds spinners
and this SO answer offers a function to pad integers with zeros

function pad (str, max) {
  str = str.toString();
  return str.length < max ? pad("0" + str, max) : str;
}

as simple as the thought of merging those two might seem like it's not working.
the goal I'm aiming for with this is to have the spinner to spin in 2 digit format format.
I've looked into spinners I didn't find any built-in helpers for this issue

here's the updated fiddle
any pointers about the code or the sipnners options is appreciated

thanks for responding guys :>
even though numberFormat answer is correct I'd like to point out that it won't work without the globalize.js included as noted is this SO answer of this duplicate question^^ sorry about duplicating
one more thing, the globalize.js original file isn't available for some reason but the kind answer-er appended the code in his fiddle so don't bother searching & get it from there
thanks again

2

There are 2 best solutions below

0
On BEST ANSWER

Use the numberFormat option:

$('#seconds').spinner({ numberFormat: "d2" });
$('#minutes').spinner({ numberFormat: "d2" });
0
On

Created a fiddle. Simply appending zero .. based on value. Hope this helps. :)

Fiddle

$( ".spinner" ).spinner({ 
    min: 1,
    max: 999,
    stop: function() {
        if($(this).val() <10)
        $(this).siblings('.spinner-text').val('0'+$(this).val());
        else
        $(this).siblings('.spinner-text').val($(this).val());
    }
 }).parent().append('<input class="spinner-text">');


$('.spinner-text').change(function() {
    $(this).siblings('.spinner').val(($(this).val()));
});