I have a javascript function in a php file to restrict users from entering only numeric data into textbox which is working fine in chrome from Windows machine. But it is not working while browsing from an Android device using same chrome browser. Already checked that Javascript is enabled in the chrome in the Android Device.
The Javascript in the HEAD section of the php file is like this
<script type="text/javascript">
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
</script>
Then the textbox
<input type="text" id="text1" name="text1" onkeypress="return isNumber(event)" />
Thanks in advance for any help or workaround
<script>
document.getElementById('text1').onkeydown = function(event){
var result = isNumber(event);
console.log(result);
}</script>
Related
I have problem. This code works well only in Google Chrome. I need it to work well in any other browser. Does anyone know how to do it and help me? I need the code to work well in firefox. Because when you open a script in the Firefox browser, the key (TAB) is detected as a letter. and I can not freely switch between columns
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript" ></script>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript" >
function preventNonNumericalInput(e){var n=void 0===(e=e||window.event).which?e.keyCode:e.which;String.fromCharCode(n).match(/^[0-9,\b,-]+$/)||(alert("WPISZ LICZBĘ"),e.preventDefault())}!function(n){n.fn.average=function(){var e=0;return this.each(function(){e+=parseFloat(n(this).val())}),e/n(this).length}}(jQuery),$(document).ready(function(){$(":reset")}),$(document).ready(function(){$("#calc").click(function(){var e=$("input[type='number']").average();console.debug(e),$("#result").html(e)}),$(".reset").on("click",function(){$("#result").html(" ")})});
</script>
<h1>Oblicz średnią:</h1>
<form action="">
<input onkeypress="preventNonNumericalInput(event)" type="number">
<input onkeypress="preventNonNumericalInput(event)" type="number">
<input onkeypress="preventNonNumericalInput(event)" type="number">
<div id="result" type="reset" ></div><br>
<input type="button" id="calc" value="Licz">
<input type="reset" value="Reset" class="reset">
</form>
</body>
</html>
So, you've put a bit of Javascript to disallow the user to use anything else than numerical inputs into the form, right ? Hence pressing any other key than the 0-9 one while in the input launch your alert : "WPISZ LICZBĘ".
First of all, you want to "unminify" your unreadable Javascript line.
function preventNonNumericalInput(e) {
var n = void 0 === (e = e || window.event).which ? e.keyCode : e.which;
String.fromCharCode(n).match(/^[0-9,\b,-]+$/) || (alert("WPISZ LICZBĘ"), e.preventDefault())
}! function(n) {
n.fn.average = function() {
var e = 0;
return this.each(function() {
e += parseFloat(n(this).val())
}), e / n(this).length
}
}(jQuery), $(document).ready(function() {
$(":reset")
}), $(document).ready(function() {
$("#calc").click(function() {
var e = $("input[type='number']").average();
console.debug(e), $("#result").html(e)
}), $(".reset").on("click", function() {
$("#result").html(" ")
})
});
This line :
String.fromCharCode(n).match(/^[0-9,\b,-]+$/) || (alert("WPISZ LICZBĘ"), e.preventDefault())
Reads the input and sees if it is a number (0-9) or an hyphen. If you add || e.keyCode == 9 it lets you use the tab button.
String.fromCharCode(n).match(/^[0-9,\b,-]+$/) || e.keyCode == 9|| (alert("WPISZ LICZBĘ"), e.preventDefault())
But you'll still have problem, like in Chrome you can use up and down arrows to increase or decrease the amount, while in Firefox this gives you an error.
Try this
function preventNonNumericalInput(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
JSFiddle for reference
I am trying restrict a user from entering more than 4 digits.
For that I am using:
$("#YEAR").mask("(9999)");
But I'm getting the following error:
JavaScript runtime error: Object doesn't support property or method 'mask'
Do I need to include a library for it?
A simple solution could be:
$(function () {
$('#YEAR').on('keypress', function(e) {
var charCode = (e.which) ? e.which : event.keyCode
if (charCode < 48 || charCode > 57) {
return false;
}
return true;
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="text" maxlength="4" id="YEAR" name="YEAR"/>
</form>
I have the following function which only allows for numerical characters to be entered in to the textbox. This is located inside common.js along with other global functions.
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode != 46 && charCode > 31
&& (charCode < 48 || charCode > 57))
return false;
return true;
}
Now inside another javascript file I have the following code, what I'm trying to achieve is bind the on keypress event of the textbox mobilenumber to the function mentioned above located in the common.js file I have made a reference to that common.js as follows:
/// <reference path="common.js" />
window.onload = function () {
document.getElementById('mobilenumber').keypress = isNumberKey(this.keypress);
};
But the error I receive is
isNumberKey is not defined $('mobilenumber').keypress = isNumberKey(this.keypress);
When I view source to check the naming conventions this is how it is rendered:
<input id="mobilenumber" class="form-control" type="text" value="" placeholder="Your Mobile Number" name="MobileNumber" data-val-maxlength-max="15" data-val-maxlength="Mobile number can not be longer then 15 characters" data-val="true">
I'm not sure where I'm going wrong with this? any help would be appreciated.
Update
Ok so I moved both javascript files into one file called common as shown here:
$(document).ready(function () {
document.getElementById('mobilenumber').keypress = isNumberKey(this.keypress);
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
});
When the page load instead of binding it, it calls it which gives me an error saying evt if undefined which I understand because nothing has been entered, why is it calling it? and how can I just bind it without having to call it?
Try
$("#mobilenumber").on("input", function(e) {
return $(this).prop("value", function(_, val) {
return val.replace(/[^\d]/, "").slice(0, 15)
})
});
$("#mobilenumber").on("input", function(e) {
return $(this).prop("value", function(_, val) {
return val.replace(/[^\d]/, "").slice(0, 15)
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="mobilenumber" class="form-control" type="text" value="" placeholder="Your Mobile Number" name="MobileNumber" data-val-maxlength-max="15" data-val-maxlength="Mobile number can not be longer then 15 characters" data-val="true">
JavaScript has no import, include, or require. There are other ways
for JavaScript to include external JavaScript contents, though...
From: How do I include a JavaScript file in another JavaScript file?
Perhaps try keeping both the function and the attachment of the event handler in one file.
You may like to check this:
http://jsfiddle.net/fq7Lkkyp/
$(document).ready(function () {
$("#mobilenumber").keypress(isNumberKey);
function isNumberKey() {
alert('check');
var charCode = (event.which) ? event.which : event.keyCode;
if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
event.preventDefault();
return false;
}
return true;
}
});
Hey guys i've been having some issues with calling my javascript function to my main HTML page.
I've got the javascript code:
function phonenumber(inputtxt)
{
var phoneno = /^\d{10}$/;
if(inputtxt.value.match(phoneno))
{
return true;
}
else
{
alert("Not a valid Phone Number");
return false;
}
}
But when i call it in my HTML i have this code:
<input type='text' name='text1'/>Phone Number: <input type="submit" name="submit" value="Submit" onclick="phonenumber(document.form1.text1)"/>
Are you able to assist me with this? sorry i'm kinda new to this :(
Thanks!
Your onclick attribute needs to know if the validation passed or not. In other words, you should return the value from your validator function.
... onclick="return phonenumber(document.form1.text1)" ...
I don't understand why you using onlclick method for validate phone no. field. I have a function try this for validation of number
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57) ) // put your condition here
return false;
return true;
}
and fire it by using
<input type="text" name="mobile" id="mobile" class="" onkeypress="return isNumberKey(event)" />
Using this code, user won't enter numeric value. In Google Chrome, input box is not taking numeric value but in Firefox it takes. I'm not getting, why it is happening. Any help appreciated.
<input type="text" name="station_name" id="station_name" onKeyPress="return noNumbers(this)" maxlength="45" />
this is my javascript function
<script type="text/javascript" language="javascript">
function noNumbers(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode;
if((charCode>=65 && charCode<=90)||(charCode>=97 && charCode<=122)||(charCode==32))
return true;
return false;
}
</script>
This is because, in Firefox, the event is passed as a parameter to the event handler. event property of the window object is IE only.
function enterHere(e)
{
e = e || window.event;
var code = e.keyCode || e.which;
if(code == 13)
find();
}
you are passing this in the following line, pass event
<input type="text" name="station_name" id="station_name" onKeyPress="return noNumbers(event)" maxlength="45" />
EDIT
ok try the follwoing function and the input tag as above:
function noNumbers(evt)
{
var charCode = evt.keyCode || evt.which;
if((charCode>=65 && charCode<=90)||(charCode>=97 && charCode<=122)||(charCode==32)||||(charCode==8))
return true;
return false;
}