onkeyup event does not work - javascript

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/

Related

javascript allow only tab, backspace and number keys

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)">

Allow only letters and spaces and capitalise each word

I need to only allow letters to be typed, and I also need to capitalise the first letter of each word using javascript. I have the first bit working on keypress, I want the second working onblur, but I can't get it to work. It works ok if I use it on its own though. I've tried a bunch of things but I must be missing something small, I just can't figure out what it is.
HTML
<tr>
<td>
<input type="text" name="first_names" onkeypress="return isAlfa(event)" onblur="toTitleCase()">
</td>
<td>
<input type="text" name="last_names" onkeypress="return isAlfa(event)" onblur="toTitleCase()">
</td>
</tr>
JAVASCRIPT
function isAlfa(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 32 && (charCode < 65 || charCode > 90) && (charCode < 97 || charCode > 122)) {
return false;
}
return true;
}
function toTitleCase(str)
{
return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}
Please assist
You need to reassign the value of the input, e.g. like onblur="this.value = toTitleCase(this.value)":
function isAlfa(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 32 && (charCode < 65 || charCode > 90) && (charCode < 97 || charCode > 122)) {
return false;
}
return true;
}
function toTitleCase(str) {
return str.replace(/\w\S*/g, function(txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}
<input type="text" name="first_names" onkeypress="return isAlfa(event)" onblur="this.value = toTitleCase(this.value)">

jQuery get numeric input from all browsers

I want the user to press on a number key while focus is on an input item, and the browser should go to foo.com/[number]
this is the code I am using:
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : event.keyCode;
if (charCode != 46 && charCode > 31
&& (charCode < 48 || charCode > 57))
return false;
return true;
}
$(document).ready(function(){
$('.my_input').keypress(function(event){
if(isNumberKey(event)){
window.location='foo.com/'+(event.keyCode-48);
}
});
});
It works on Google Chrome, but Firefox users are getting errors. I also want to implement a mobile version where the user can input the number, and press the "enter" key of the mobile device.
How can I ensure that this will work on all browsers that support javascript?
Thanks for any help!
Here's your code corrected but I don't think this is really what you're after. Note that charcode returned from the numpad is different from the that of the number-key row.
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : evt.keyCode;
if ((charCode >= 48 && charCode <= 57) || (charCode >= 96 && charCode <= 105)) { //0-9 only (inc numpad)
return true;
}
return false;
}
$(document).ready(function(){
$("input[type='number']").on("keyup",function(evt){
if(isNumberKey(evt)){
var charCode = (evt.which) ? evt.which : evt.keyCode;
//window.location='foo.com/'+(charCode-48);
alert('foo.com/'+(charCode-48));//minus 48 wont work if numpad
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" value="" />
It may be better to just get the value of the input instead...
$(document).ready(function(){
$("input[type='number']").on("keyup",function(){
var val = parseInt(this.value);
this.value="";
if(val>0){
alert('foo.com/'+val);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" value="" />

Allow only numbers in Textbox not working : ASP.NET

I need only numbers in textbox. This is the javascript code that I am using :
function onlyNumbers(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
alert(charCode);
return false;
}
return true;
}
The ASP text box on which I am calling the above function is :
<asp:TextBox ID="txtArtCount" placeholder="Numeric" onKeypress="return onlyNumbers(event);" runat="server" Width="65px" CssClass="searchTextBoxes"></asp:TextBox>
I am using Internet Explorer8 browser. I checked in Chrome as well but it is not working.
On pressing key in textbox, alert is shown but the text gets typed in the textbox as well.
code works correctly , I used input type text instead asp one , check in view source if something renders incorrectly or not
function onlyNumbers(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
alert(charCode);
return false;
}
return true;
}
<input type="text" ID="txtArtCount" placeholder="Numeric" onKeypress="return onlyNumbers(event);" />
hope that helps !

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);";

Categories

Resources