How to write this in a simpler less ridiculous way

Question

This just seems absurd to me. Should I use array instead or is there some other better solution?

$('.hoursRange').change(function() {
    if ('0' == $(this).val())
    {
        $(this).val('00');
        return false;
    }
    if ('1' == $(this).val())
    {
        $(this).val('01');
        return false;
    }
    if ('2' == $(this).val())
    {
        $(this).val('02');
        return false;
    }
    if ('3' == $(this).val())
    {
        $(this).val('03');
        return false;
    }
    if ('4' == $(this).val())
    {
        $(this).val('04');
        return false;
    }
    if ('5' == $(this).val())
    {
        $(this).val('05');
        return false;
    }
    if ('6' == $(this).val())
    {
        $(this).val('06');
        return false;
    }
    if ('7' == $(this).val())
    {
        $(this).val('07');
        return false;
    }
});

this is seems complicated of course. Why aren't the dropdown values already prependended ? — dvhh, Jan 12 '11 at 08:53
Hmm, I +1'd you but it cannot be a dropdown since how can you set the value of the dropdown to 06 if the value is 6? Or can jQuery change the actual value="6" to value="06" using .val()? — mplungjan, Jan 12 '11 at 08:57
@mplungjan Input values are strings. So it's not 06 but '06' what $(this).val() returns. — Richard Knop, Jan 12 '11 at 09:02
So please re-read my comment and imagine quotes around my numbers. The question still stands. — mplungjan, Jan 12 '11 at 11:03

karim79 · Answer 1 · 2011-01-12T09:02:37.623

5

if($(this).val().length == 1) {
    $(this).val('0' + $(this).val());
}

Or just pad all of the single digits with zeros on page load, rather than onchange:

$('.hoursRange option').filter(function() {
    return $(this).val().length == 1;
}).each(function() { 
    $(this).val('0' + $(this).val());
});

Demo: http://jsfiddle.net/WKdWq/

edited Jan 12 '11 at 09:02

answered Jan 12 '11 at 08:51

karim79

339,989
67
413
406

score 5 · Answer 2 · answered Jan 12 '11 at 08:53

5

Just use a regex:

$(this).val($(this).val().replace(/^[0-7]$/, "0$&"));

answered Jan 12 '11 at 08:53

Peter

127,331
53
180
211

1

this seems to be the most appropriate answer that I agree with without further info from the author – dvhh Jan 12 '11 at 08:56

score 1 · Accepted Answer · answered Jan 12 '11 at 08:50

1

$(this).val('0' + $(this).val());?

answered Jan 12 '11 at 08:50

maid450

7,478
3
37
32

please add a check to see that $(this).val() is 0 to 7 to begin with – Kinjal Dixit Jan 12 '11 at 08:53
But you accepted a sub-optimal suggestion unless jQuery automatically casts the .val() into an int or float due to the + which normally converts to string when concatenating to a string before it. – mplungjan Jan 12 '11 at 11:07
seems like wrong solution has been accepted as correct answer. please check out the rest of responses. – Alexander Beletsky Jan 12 '11 at 16:46

score 1 · Answer 4 · answered Jan 12 '11 at 08:52

1

var value = $(this).val();
if ($(this).val().length < 2) {
   $(this).val('0' + value);
}

answered Jan 12 '11 at 08:52

Alexander Beletsky

19,453
9
63
86

would a trim be handy here or are we sure that the string of the .val() is the length of the digit it contains? – mplungjan Jan 12 '11 at 08:56

score 1 · Answer 5 · answered Jan 12 '11 at 08:53

1

$('.hoursRange').change(function() {
   if (parseInt($(this).val(),10)<10) $(this).val("0"+parseInt($(this).val(),10));
}

answered Jan 12 '11 at 08:53

mplungjan

169,008
28
173
236

the second parseInt is useless as when you are appending to it a string you are converting it to a string again... – maid450 Jan 12 '11 at 08:57
Not if the value had leading 0s – mplungjan Jan 12 '11 at 11:02
And we need the 10 in the parseInt(,10) since 08 and 09 are invalid octals (not that the author wanted 8 or 9 in the question) – mplungjan Jan 12 '11 at 11:08

score 1 · Answer 6 · edited May 23 '17 at 12:18

1

A function for zero-padding is available from this answer. Using that, you can simply do:

$('.hoursRange').change(function() {
    $(this).val( zerofill($(this).val(), 2) );
}

edited May 23 '17 at 12:18

Community

1
1

answered Jan 12 '11 at 08:53

Sebastian Paaske Tørholm

49,493
11
100
118

score 0 · Answer 7 · edited Oct 06 '18 at 11:45

0

I am not an expert on jQuery but it is awkward. I would check boundary condition (0<=$(this).val()<=7) and if not met return false. Otherwise

var v = $(this).val();
v='0'+v;
$(this).val(v);

edited Oct 06 '18 at 11:45

Stephen Kennedy

20,585
22
95
108

answered Jan 12 '11 at 08:54

Nickolodeon

2,848
3
23
38

score 0 · Answer 8 · answered Jan 12 '11 at 13:55

0

$('.hoursRange').change(function() {
    $(this).val( $(this).val().replace(/(\b\d\b)/,'0$1') );
}

I don't see you needing any conditional statements or additional expensive jQuery calls in here.

answered Jan 12 '11 at 13:55

bstst

519
2
14

How to write this in a simpler less ridiculous way

8 Answers8