Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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;
}
like image 797
cyberfly Avatar asked Apr 04 '11 06:04

cyberfly


People also ask

What is e keycode === 13?

Keycode 13 is the Enter key.

How do I allow only numbers in JavaScript?

By default, HTML 5 input field has attribute type=”number” that is used to get input in numeric format. Now forcing input field type=”text” to accept numeric values only by using Javascript or jQuery. You can also set type=”tel” attribute in the input field that will popup numeric keyboard on mobile devices.

What is charCode in JavaScript?

The charCode property returns the Unicode character code of the key that triggered the onkeypress event. The Unicode character code is the number of a character (e.g. the number "97" represents the letter "a").


2 Answers

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.

like image 125
dominicbri7 Avatar answered Oct 11 '22 22:10

dominicbri7


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:&nbsp;&nbsp;<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

like image 30
manoj Avatar answered Oct 11 '22 23:10

manoj