Disable text when input number uses placeholder

Question

How to disable text when using placeholder?

<input type="number" placeholder="Min.">

EDIT

The input number should allow the user to enter only numbers.

http://stackoverflow.com/questions/18224064/dont-allow-typing-alphabetic-characters-in-a-input-type-number — AmmarCSE, Jun 11 '15 at 15:22
input number don't force the user to enter number, it just won't return anything from the form if it's not a number. — Guillaume Beauvois, Jun 11 '15 at 15:36

brunodd · Accepted Answer · 2015-06-12T16:01:20.827

0

The jquery numeric plugin did the trick. Thank you all for the help. I had to write more text because the answer should be 30 characters minimum.

$(document).ready(function(){
   $(".numeric").numeric();
});

edited Jun 12 '15 at 16:01

answered Jun 11 '15 at 15:42

brunodd

2,474
10
43
66

Yes that's what I did, if you check again there is a link with the answer. – brunodd Jun 12 '15 at 13:18

score 0 · Answer 2 · edited May 23 '17 at 12:22

This stops the user from inputting any character which is not a number, while still allowing them to use non-printable keys (ctrl, alt, backspace, enter, etc.)

This first part is from this answer to a different question

The second part basically checks every time the user presses a key, to see if that key was...

Printable, and
Not a number

If both of these conditions are met, prevent the character from being entered.

// https://stackoverflow.com/a/12467610/4639281
function printable(keycode) {
    var valid =
        (keycode > 47 && keycode < 58)   || // number keys
        keycode == 32 || keycode == 13   || // spacebar & return key(s) (if you want to allow carriage returns)
        (keycode > 64 && keycode < 91)   || // letter keys
        (keycode > 95 && keycode < 112)  || // numpad keys
        (keycode > 185 && keycode < 193) || // ;=,-./` (in order)
        (keycode > 218 && keycode < 223);   // [\]' (in order)
    return !!valid;
}

// This part is me
document.getElementById('min').onkeydown = function(e) {
    var char = String.fromCharCode(e.keyCode);
    if(printable(e.keyCode) & isNaN(char)) {
        e.preventDefault();
    }
}

<input type="text" placeholder="Min." id="min">

Disable text when input number uses placeholder

2 Answers2