javascript allow only tab, backspace and number keys - javascript

In JavaScript code how to allow exception for tab and backspace.
On keypress event
onkeypress="return isNumberKey(event, this)"
Code is
function isNumberKey(evt, el) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && ((charCode < 48 || charCode > 57)) return false;
if (el.value.length > 2)
return false;
return true;
}
}

This solved my problem,
I added exception in second condition
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
if (el.value.length >= 2 && charCode != 8)
return false;
return true;

<script>
function isNumberKey(evt, el) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && ((charCode < 48 || charCode > 57))) return false;
if (el.value.length > 2)
return false;
return true;
}
</script>
<input type="text" id="text" onkeypress="return isNumberKey(event, this)">

Related

Why isn't the backspace working in a number field of a HTML5 contact form in Firefox?

I am trying to fix a JavaScript error related to a contact form. When the user is trying to enter their contact number they aren't able to correct it and they can't use the backspace key. This problem only comes up in Firefox, in Chrome, it is working completely fine.
Here is my code:
CG = (function(){
var
_isNumeric = function(evt){
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if(charCode >= 48 && charCode <= 57)
return true;
return false;
},
_isDecimal = function(evt){
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if((charCode >= 48 && charCode <= 57) || charCode==46)
return true;
return false;
},
_alphanumeric = function(evt){
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
return ((charCode > 64 && charCode < 91) || (charCode > 96 && charCode < 123) || charCode == 8 || charCode == 32 || (charCode >= 48 && charCode <= 57));
};
return{
isDecimal:_isDecimal,
isNumeric:_isNumeric
}
});
$(document).ready(function(){
$("input[type=text]").on("keypress",".isDecimal",function(e){
return CG.isDecimal(e);
});
$(document).on("keypress",".isNumeric",function(e){
return CG.isNumeric(e);
});
$(document).on("keypress",".alphanumeric",function(e){
return CG.alphanumeric(e);
});
$(document).on("keypress",".isDecimal",function(e){
return CG.isDecimal(e);
});
})

onkeyup event does not work

onkeypress it's work good but Why onkeyup not working ? How to do for working with onkeyup ?
https://jsfiddle.net/btykt0nk/
function isNumber(number_check) {
number_check = (number_check) ? number_check : window.event;
var charCode = (number_check.which) ? number_check.which : number_check.keyCode;
console.log(charCode);
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
<input type="text" onkeyup="return isNumber(event);">
We should handle it in onkeypress.
Check this out
<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57'>
</input>
There's no need to use return here, you just need to attach your function to the onkeyup event:
onkeyup="isNumber(event)"
function isNumber(event) {
event = (event) ? event : window.event;
var charCode = (event.which) ? event.which : event.keyCode;
//console.log(charCode);
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
console.log(false);
}else{
console.log(true);
}
}
<input type="text" onkeyup="return isNumber(event);">
And in your function use console.log(true) and console.log(false) to track the result, because return false or return truewon't be very helpful here.
EDIT:
To make your input accept only numbers you can use event.preventDeafult() along with onkeypress event because onkeyup will fire the function after writing that character, it will exit when it isn't a number:
function isNumber(event) {
event = (event) ? event : window.event;
var charCode = (event.which) ? event.which : event.keyCode;
//console.log(charCode);
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
console.log(false);
event.preventDefault();
}else{
console.log(true);
}
}
<input type="text" onkeypress="isNumber(event);">
Try onkeyup="isNumber(event)" (without return)
Updated your fiddle
<input type="text" onkeyup="isNumber(event)">
https://jsfiddle.net/btykt0nk/1/

PL/SQL NUMBERS ONLY

I am trying to create a numbers only text box in a PL/SQL screen. I am not very familiar with PL SQL or if this would even work.
I cant get this to work. Any suggestions?
htp.p('<html><head>');
htp.p('<script type="text/avascript">
$(function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
else
return true;
});
</script>');
htp.p('</head>');
htp.p('<INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">');
You are declaring the function inside $(), thus that function is not available to the global scope. To declare it globally, use this:
htp.p('<script type="text/javascript">
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
else
return true;
}
</script>');
Should work as expected now.
Original demo (with problem).
Fixed demo (working).

numeric validation not working in firefox

i have a textbox which i need to accept only digits.All other keys in the keyboard sholdn't generate event in the textbox.i created a javascript code
<script type="text/javascript">
function onlyNumbers(evt)
{
var e = event || evt; // for trans-browser compatibility
var charCode = e.which || e.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
</script>
html is
<asp:TextBox ID="txtFreeship" runat="server" Width="50px" onkeypress="return onlyNumbers();">
</asp:TextBox>
it is not working in mozilla firefox(working perfectly in internet explorer).can any one please answer
Call the following function on form load
function isDecimalKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && charCode > 46 && (charCode < 48 || charCode > 57)) {
return false;
}
else {
return true;
}
}
txtNoSeat.Attributes["onKeyPress"] = "Javascript:return isNumberKey(event);";

JavaScript keycode allow number and plus symbol only

I have this JavaScript function that is used to force user only type number in the textbox. Right now and I want to modify this function so it will allow the user to enter plus (+) symbol. How to achieve this?
//To only enable digit in the user input
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
Since the '+' symbol's decimal ASCII code is 43, you can add it to your condition.
for example :
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode != 43 && charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
This way, the Plus symbol is allowed.
This code might work. I added support for SHIFT + (equal sign) and the numpad +.
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode;
var shiftPressed = (window.Event) ? e.modifiers & Event.SHIFT_MASK : e.shiftKey;
if ((shiftPressed && charCode == 187) || (charCode == 107))
{
return true;
} else if ((charCode > 95) && (charCode < 106)) {
return true;
} else if (charCode > 31 && (charCode < 48 || charCode > 57))) {
return false;
} else {
return true;
}
}
this is stupid ... not really an answer at all. I would suggest you to do following.
function isNumberKey(evt)
{
console.log(evt.keyCode);
return false;
}
And find out the ranges of all keys, and implement it.
It's Work. Javascript keycode allow number and plus symbol only
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript form validation</title>
</head>
<body>
<form name="form1" action="#">
Mobile Number: <input type='text' id='PhoneNumber' maxlength="10" onKeyPress="return IsNumeric3(event);" ondrop="return false;" onpaste="return false;"/>
<span id="error3" style="color: Red; display: none">* Input digits (0 - 9)</span>
</form>
<script type="text/javascript">
var specialKeys = new Array();
specialKeys.push(8);
specialKeys.push(43);
specialKeys.push(37);
specialKeys.push(39);
//Backspace
function IsNumeric3(e) {
var keyCode = e.which ? e.which : e.keyCode
var ret = (keyCode != 37 && keyCode != 8 && keyCode != 46 && (keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1);
document.getElementById("error3").style.display = ret ? "none" : "inline";
return ret;
}
</script>
<script>
function stringlength(inputtxt, minlength, maxlength)
{
var field = inputtxt.value;
var mnlen = minlength;
var mxlen = maxlength;
if(field.length<mnlen || field.length> mxlen)
{
alert("Please input the 10 digit mobile number");
return false;
}
else
{
return true;
}
}
</script>
</body>
</html>
Thank you friends
Here is the modified code:
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if ( (charCode >= 48 && charCode <= 57) || charCode == 43)
return true;
return false;
}
Here is the code . working fine with numbers and plus + sign in phone fields. you will have to implement the code on keydown function . target the id/class of the particular phone field and use keydown function.
//allows only these keys
// backspace, delete, tab, escape, and enter
if ( event.keyCode == 107 || event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
// Ctrl+A
(event.keyCode == 65 && event.ctrlKey === true) ||
// home, end, left, right
(event.keyCode >= 35 && event.keyCode <= 39)) {
return;
}
else {
// Ensure that it is a number and stop the keypress
if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
event.preventDefault();
}
}
Using experience of my colleagues above, write one function, that fits me well. It filters all except numbers, arrows and backspace. Maybe it would be useful for somebody.
function isKeyCorrect(keyEvent) {
var charCode = keyEvent.which ? keyEvent.which : keyEvent.keyCode;
var isNotNumber = charCode < 48 || charCode > 57;
var isNotArrow = charCode < 37 || charCode > 40;
var isNotBackspace = charCode !== 8;
return isNotNumber && isNotArrow && isNotBackspace;
}
<script type="text/javascript">
$(document).ready(function() {
`enter code here` $('#form-1').submit(function(msg) {
$.post("action.php?act=login",$(this).serialize(),function(data){
if (data == 'ERR:A3001004') { alert("Güvenlik hatası, sayfayı yenileyin."); }
else if (data == 'TIMEEND') { alert("Anahtarınızın süresi dolmuş."); }
else if (data == 'INVALID') { alert("Geçersiz anahtar şifresi girdiniz."); }
else if (data == 'OK') { alert("Başarıyla giriş yaptınız. Yetişkinlere göre içerik barındıran sitelere erişim sağlayabilirsiniz."); }
});
return false;
});
});
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
</script>

Categories

Resources