Introduction
With using JQuery (2.1.4), I changed (enforecd) html input to an integer (numeric) input (textbox) mask.
Sample Application
This sample application was developed by using Microsoft Visual Studio 2013
Download JQUERY_INTEGER_TEXTBOX_VERSION_1_0_0-noexe.zip
What Characters This Input Mask Accept?
With this JQuery code, you can use below characters in your textbox:
- All of numbers in your keyboard (even numlock numbers)
- TAB
- SHIFT + TAB
- LEFT ARROW KEY
- SHIFT + LEFT ARROW KEY
- RIGHT ARROW KEY
- SHIFT + RIGHT ARROW KEY
- DELETE
- BACKSPACE
- SHIFT + INS
- CTRL + INS
- CTRL + C
- CTRL + V
Note that you should use the "integer" css class for each of your input htmls that you want to behave such as an integer (numeric) input mask. for example:
<input type="text" class="integer" />
Using the code
$(document).ready(function () {
$("input.integer").keydown(function (e) {
if (e.ctrlKey) {
if (!((e.keyCode == 45) ||
(e.keyCode == 67) ||
(e.keyCode == 86))) {
e.preventDefault();
}
}
else {
if (e.shiftKey) {
if (!((e.keyCode == 9) ||
(e.keyCode == 37) ||
(e.keyCode == 39) ||
(e.keyCode == 45))) {
e.preventDefault();
}
}
else {
if (!((e.keyCode == 8) ||
(e.keyCode == 9) ||
(e.keyCode == 37) ||
(e.keyCode == 39) ||
(e.keyCode == 46) ||
((e.keyCode >= 48) && (e.keyCode <= 57)) ||
((e.keyCode >= 96) && (e.keyCode <= 105)))) {
e.preventDefault();
}
}
}
});
});