Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I make the HTML5 number field display trailing zeroes?

I have a field:

<input type='number' /> 

I'd like to punch in 0.50 without it “correcting it” to 0.5, so it would display 0.50.

like image 286
Tarang Avatar asked Oct 17 '11 07:10

Tarang


People also ask

How do you get trailing zeros?

The number of trailing zeros in a non-zero base-b integer n equals the exponent of the highest power of b that divides n. For example, 14000 has three trailing zeros and is therefore divisible by 1000 = 103, but not by 104. This property is useful when looking for small factors in integer factorization.

How do you add leading zeros in HTML?

Use the String() object to convert the number to a string. Call the padStart() method to add zeros to the start of the string. The padStart method will return a new, padded with leading zeros string.


1 Answers

I attached an on('change') event to the input you want to have trailing 0's

$('.number-input').on('change', function(){     $(this).val(parseFloat($(this).val()).toFixed(2)); }); 

It just takes the value, casts it to a float, renders it to a string to the number of decimal places, and puts it back in as the value.

like image 68
Jacob Valenta Avatar answered Sep 22 '22 04:09

Jacob Valenta