Geek asks and answers

Limit input field to two decimal places with jQuery

I have an input field that I want to limit so that the user can enter a number with a maximum of two decimal places. Want to do it with jQuery.

Is there any way to use the jQuery toFixed () function ?

Thanx!

+5
source share
7 answers
$('input#decimal').blur(function(){
    var num = parseFloat($(this).val());
    var cleanNum = num.toFixed(2);
    $(this).val(cleanNum);
    if(num/cleanNum < 1){
        $('#error').text('Please enter only 2 decimal places, we have truncated extra points');
        }
    });

Here is the fiddle http://jsfiddle.net/sabithpocker/PD2nV/

Using toFixedwill lead to approximation. 123.6666 -> 123.67 If you want to avoid approximation, check this answer. Show two decimal places, without rounding.

+8
source 
<input type="text" name="amount1" id="amount1" class="num_fld Amt" onkeypress="return check_digit(event,this,8,2);" size="9" value="" maxlength="8" style="text-align:right;" />

,

function check_digit(e,obj,intsize,deczize) {
    var keycode;

    if (window.event) keycode = window.event.keyCode;
    else if (e) { keycode = e.which; }
    else { return true; }

    var fieldval= (obj.value),
        dots = fieldval.split(".").length;

    if(keycode == 46) {
        return dots <= 1;
    }
    if(keycode == 8 || keycode == 9 || keycode == 46 || keycode == 13 ) {
        // back space, tab, delete, enter 
        return true;
    }          
    if((keycode>=32 && keycode <=45) || keycode==47 || (keycode>=58 && keycode<=127)) {
         return false;
    }
    if(fieldval == "0" && keycode == 48 ) {
        return false;
    }
    if(fieldval.indexOf(".") != -1) { 
        if(keycode == 46) {
            return false;
        }
        var splitfield = fieldval.split(".");
        if(splitfield[1].length >= deczize && keycode != 8 && keycode != 0 )
            return false;
        }else if(fieldval.length >= intsize && keycode != 46) {
            return false;
        }else {
            return true;
        }
    }
}
+3

HTML5:

<input type="number" step="0.01" />

( ), :invalid:

input:invalid {   box-shadow: 0 0 1.5px 1px red;   }

, , , , :

Screenshot on Firefox

+3
$("#myInput").focusout(function() {
    if ($(this).val().length > 2 || isNaN(Number($(this).val())) {
        alert("Wrong number format");
    }
});
+2

:

    $('#id').on('input', function () {
        this.value = this.value.match(/^\d+\.?\d{0,2}/);
    });

id css.

+2

:

inputField.value.replace(/(\...)(.)/, "$ 1" );

:

inputField.value.replace(/(\. [0-9] [0-9]) ([0-9])/, "$ 1" );

I found this method here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Example:_Switching_words_in_a_string

0
source 
<input type="text" id="decCheck" onkeyup="decimalCheck();"/>

<script>
function decimalCheck(){
var dec = document.getElementById('decCheck').value;
if(dec.includes(".")){
    var res = dec.substring(dec.indexOf(".")+1);
    var kl = res.split("");
    if(kl.length > 1){
     document.getElementById('decCheck').value=(parseInt(dec * 100) / 
      100).toFixed(2);
    }
  }
}
</script>
0
source

More articles:


All Articles