We Keep Coding

Accept only numbers and tab in inputs javascript

I have some text fields and I want the user to write only numbers and also TAB to go to other inputs easily. I have this javascript code:
function validateNumbers(event) {
if(event.charCode >= 48 && event.charCode <= 57){
return true;
}
return false;
}
And in the HTML I use the attribute onkeypress to call the function.
Could you help me with my code to also accept the TAB key please?

be careful this codes was not working in mobile browsers.
$(document).ready(function() {
$("#txtboxToFilter").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A, Command+A
(e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
});

You can use tabindex="1" property in your input tag to specify which input it needs to be focused next using numbers like 1,2 etc.
Here is an example based on your code

Instead of keypress, handle keydown and remove all non-numeric values
var input = document.querySelectorAll( "input" );
Array.from( input ).forEach( function( el ){
el.addEventListener( "keyup", validateNumbers );
});
function validateNumbers(event)
{
var inputObj = event.currentTarget;
inputObj.value = inputObj.value.replace(/[^0-9]/g, "");
}
<input/>
<input/>

jQuery - How can I allow both numpad and number key row input; as well as prevent special characters from being entered?

I want to allow both number pad numeric and oridinary number from keyboard. Currently, it only allows the number key row. I also only want numbers to be entered, but it currently allows special characters.
$(document).ready(function() {
$('#price').keydown(function(event) {
if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57) && event.which != 8) {
event.preventDefault();
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='price'>

Have a look at this plug-in (Fork of texotela's numeric jquery plugin). This (jStepper) is another one.
This is a link if you want to build it yourself.
$(document).ready(function() {
$("#txtboxToFilter").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A, Command+A
(e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
});
NOTE: If your webpage uses HTML5, you can use the built-in <input type="number"> and use the min and max properties to control the minimum and maximum value.
$(function() {
$('#staticParent').on('keydown', '#child', function(e){-1!==$.inArray(e.keyCode,[46,8,9,27,13,110,190])||(/65|67|86|88/.test(e.keyCode)&&(e.ctrlKey===true||e.metaKey===true))&&(!0===e.ctrlKey||!0===e.metaKey)||35<=e.keyCode&&40>=e.keyCode||(e.shiftKey||48>e.keyCode||57<e.keyCode)&&(96>e.keyCode||105<e.keyCode)&&e.preventDefault()});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="staticParent">
<input id="child" type="textarea" />
</div>
I coppied from it on here
If its help for you.Please vote first writer .

Updated your code
$(document).ready(function() {
$('#price').keydown(function(event) {
if((event.which >= 48 && event.which <= 57) && event.shiftKey) {
event.preventDefault();
}
if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57) && event.which != 8) {
event.preventDefault();
}
});
});

Use keypress for that instead of keydown
then
the keyCode of 0 to 9 are 48 to 57 so use this condition
if (event.keyCode < 48 || event.keyCode > 57) {
event.preventDefault();
}
this condition returns true if you enter keys that are not 0, 1, 2, 3, 4, 5, 6, 7 ,8 and 9 or not numbers
So your code would be like this
$(document).ready(function() {
$('#price').keypress(function(event) {
if (event.keyCode < 48 || event.keyCode > 57) {
event.preventDefault();
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='price'>

Why we don't user input type number. I think just do it easy like this:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='number' id='price'>

JQuery number only validation

$('.alphaOnly').bind('keypress', function(event){
var regex = new RegExp("^[ A-Za-z-.']*$");
validation(event, regex);
});
This is my validation for number only in a input. It works prefectly on desktop, iphone but not in android specifically samsung phone.
Does anyone of you ever encountered this kindof problem?

There are two way to achieve this.
1. Use onkeypress event of javascript and allow to enter numeric value only. In this way you will not able to enter decimal values.
<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57'></input>
Check below snippet. In this way you will be able to enter decimal values.
$(document).ready(function() {
$("#txtboxToFilter").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && e.ctrlKey === true) ||
// Allow: Ctrl+C
(e.keyCode == 67 && e.ctrlKey === true) ||
// Allow: Ctrl+X
(e.keyCode == 88 && e.ctrlKey === true) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<input type="text" id="txtboxToFilter" />

Maybe you should try this way
var regex = new RegExp('\\d');
Have no Samsung, but on my android device works as it should
jsfiddle.

Validate and append phone input Jquery

I have some input field that always has to have + first in input
HTML
<input id="phone">
JS
$("#phone").keydown(function (e) {
$(this).get(0).value+="+";
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && e.ctrlKey === true) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
The problem is you can see in this fiddle
http://fiddle.jshell.net/nqkeuspf/
UPDATE
$("#phone").keydown(function (e) {
var firstChar = $(this).val().substr(0, 1);
// Check first character.
if (firstChar != '+'){
$(this).val('+' + $(this).val())
}
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190,107]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && e.ctrlKey === true) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
The problem is that it doesn not check +
Fiddle
http://fiddle.jshell.net/bjsrk83j/3/

Add this as keypress handler. It allows only numbers and you can supply it with a filter to allow other characters like +. Esc allows the user to cancel.
function escapeRegExp(str) {
return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}
function handleInputKey(filter, e) // append filter as string '+-.,' for example.
{
if (!e) {
var e = window.event;
}
//allow only numeric input
//48-57 and 96-105 (keyboard left and numpad)
//also delete, back space, esc, enter, arrows and tab
if ((filter && filter.match(escapeRegExp(String.fromCharCode(e.which)))) || ((e.keyCode >= 48 && e.keyCode <= 57) && (!e.shiftKey && !e.altKey && !e.ctrlKey))) {
return true;
} else {
e.preventDefault();
return false;
}
}
//the onkeydown handler
function handleInputKeyFinish(e) {
if (!e) {
var e = window.event;
}
if (e.keyCode == 27) {
this.blur();
}
}
function stripAndAppendPlus(e) {
//when the users pastes a value delete invalid characters.
e.target.value = e.target.value.replace(/[^0-9]/g, "");
e.target.value = "+" + e.target.value;
}
$("#phone").keydown(handleInputKeyFinish);
$("#phone").keypress(handleInputKey.bind($("#phone")[0], null));
$("#phone").blur(stripAndAppendPlus);
Solution in Fiddle: http://fiddle.jshell.net/bqa87bwh/1/
Even simpler not using jQuery or JavaScript. This is HTML5 so not compatible with older browsers.
<input type="phone" pattern="^\+?\d{7,13}$" required />
pattern checks the input against a reg ex. This reg ex allows phone numbers consisting out of 7 to 13 numbers and they can begin with a +.
required --> this field has to contain a value otherwise the form won't be submitted.
Solution in Fiddle: http://fiddle.jshell.net/e76t41rj/1/

jQuery only digits in input

I want only numbers in my input. I can't change type of input to "number". So I have this code.
Number : <input type="text" name="quantity" id="quantity" />
<script>
$(document).ready(function() {
$("#quantity").off("keyup").on("keyup", function(e) {
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 190]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && e.ctrlKey === true) ||
// Allow: home, end, left, right
(e.keyCode >= 35 && e.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
});
});
And it's not works but if i change selector to $("#quantity").off("keyup").on("keyup", function(e) { It works. I haven't change the first selector

try like this,
function isNumber(n){
return (parseFloat(n) == n);
}
$("document").ready(function(){
$("input").keyup(function(event){
var input = $(this).val();
if(!isNumber(input)){
$(this).val(input.substring(0, input .length-1));
}
});
});
Demo