Using OnkeyDown as an if condition Javascript - javascript

I would like to use .onkeydown to restrain my input field. I wrote this function, but I'd like to use it in an if condition, to check if entry keys are right or wrong.
But I don't know how form should I use in my if to call this function, because actually it's not really an Angular scope function, but a JS one...
var cpNumber = document.getElementById("cpNumber");
cpNumber.onkeydown = function(e) {
if((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCode > 47 && e.keyCode < 58)
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 65))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 65))
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 66))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 66))
|| e.keyCode == 8) {
return true;
} else {
return false;
}
};
// If condition, check if entry keys are wrong.
// I tried cpNumber.onkeydown(e), but the "e"
// seems drop from the sky, it always shows "false".
if(cpNumber.onkeydown(e) === false) {
alertPopup = $ionicPopup.alert({
title: 'Oups...',
cssClass: 'pop',
template: '<div class="center-form">This is Wrong !</div>'
});
}
<form>
<input class="input"
type="text"
id="cpNumber"
maxlength="5"
ng-model="cp"
placeholder="CP">
</form>

You need to put the calls in the blocks themselves. Here's a fiddle for you to look at:
https://jsfiddle.net/tsamzx6h/
if((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCode > 47 && e.keyCode < 58)
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 65))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 65))
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 66))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 66))
|| e.keyCode == 8)
{
alert("Good!");
}
else
{
alert("Wrong");
}

Event cannot be called this way. For making your program functional you can add a function in your else block and call it and do whatever you want.
PLUS you can also pass your event to function. So that will serve as an added advantage.
HTML:
<form><input class="input" type="text" id="cpNumber" maxlength="5" ng-model="cp" placeholder="CP"></form>
Script::
ar cpNumber = document.getElementById("cpNumber");
cpNumber.onkeydown = function(e) {
if((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCode > 47 && e.keyCode < 58)
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 65))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 65))
|| ((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCorde == 66))
|| ((e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode == 66))
|| e.keyCode == 8)
{
return true;
}
else
{
notAllowed(e);
}
};
// If condition, check if entry keys are wrong. I tried cpNumber.onkeydown(e), but the "e" seems drop from the sky, it always shows "false".
function notAllowed (ev) {
alertPopup = $ionicPopup.alert({
title: 'Oups...',
cssClass: 'pop',
template: '<div class="center-form">This is Wrong !</div>'
});
}

Related

jQuery to only accept values between 1 and 100 in contenteditable element

How can I go about only allowing values between 1 and 100 in my HTML table td cells,
Currently, I have a jquery function only allowing numbers,
//only allow numbers in td
$(".allow_only_numbers").keydown(function (e) {
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 ||
((e.keyCode == 65 || e.keyCode == 86 || e.keyCode == 67) && (e.ctrlKey === true || e.metaKey === true)) ||
(e.keyCode >= 35 && e.keyCode <= 40)) {
return;
}
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
However, I only want values ranging from 1-100
The td is content editable and cells I only want to contain such values have a class called allow_only_numbers e.g
<td contenteditable='true' class="allow_only_numbers">-</td>
I would do something like this
$(".allow_only_numbers").keydown(function (e) {
if($(".allow_only_numbers").innerText < 100 && $(".allow_only_numbers").innerText >= 1 ) {
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 ||
((e.keyCode == 65 || e.keyCode == 86 || e.keyCode == 67) && (e.ctrlKey === true || e.metaKey === true)) ||
(e.keyCode >= 35 && e.keyCode <= 40)) {
return;
}
else if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
} else alert('number out of range')
});

Disable Keyboard Shotcuts

I have a "textarea". I want to make a calculator but before starting I need to be sure that everything is working well.
If I press the '1' key it works. If I press the '/' key it opens 'fast search'.
When I am in Google Chrome I can't use the "+ and - " what can I do?
function doc_keyUp(e) {
if (e.altKey && e.keyCode == 13 || e.keyCode == 49) {
document.getElementById("area").value += "1";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 50) {
document.getElementById("area").value += "2";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 51) {
document.getElementById("area").value += "3";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 52) {
document.getElementById("area").value += "4";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 53) {
document.getElementById("area").value += "5";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 54) {
document.getElementById("area").value += "6";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 55) {
document.getElementById("area").value += "7";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 56) {
document.getElementById("area").value += "8";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 57) {
document.getElementById("area").value += "9";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 48) {
document.getElementById("area").value += "0";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 61) {
document.getElementById("area").value += "+";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 191) {
document.getElementById("area").value += "/";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 173) {
document.getElementById("area").value += "-";
$('#area').val(textVal.substring(0, texVal.length = 1));
}
}
document.addEventListener('keyup', doc_keyUp, false);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="area" onKeyPress="return validateKey(event)"></textarea>
For "+" and "-" try to use key codes 187 and 189.
event.preventDefault(); - should prevent open 'fast search'.
<!DOCTYPE html>
<html>
<body>
<textarea id="area"></textarea>
<script>
function doc_keyUp(e) {
if (e.altKey && e.keyCode == 13 || e.keyCode == 49) {
document.getElementById("area").value += "1";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 50) {
document.getElementById("area").value += "2";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 51) {
document.getElementById("area").value += "3";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 52) {
document.getElementById("area").value += "4";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 53) {
document.getElementById("area").value += "5";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 54) {
document.getElementById("area").value += "6";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 55) {
document.getElementById("area").value += "7";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 56) {
document.getElementById("area").value += "8";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 57) {
document.getElementById("area").value += "9";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 48) {
document.getElementById("area").value += "0";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 187) {
document.getElementById("area").value += "+";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 191) {
document.getElementById("area").value += "/";
}
if (e.altKey && e.keyCode == 13 || e.keyCode == 189) {
document.getElementById("area").value += "-";
}
e.preventDefault();
}
document.addEventListener('keyup', doc_keyUp, false);
</script>
</body>
</html>

Not able to Select, Copy & Paste in Textbox

I restrict user to enter only number in textbox through javascript, but i face a problem that not able to perform select,copy & paste through keyboard.
Here is Code:-
if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190 || event.keyCode == 110) {
} else {
event.preventDefault();
}
if (($(this).val().indexOf('.') !== -1 && event.keyCode == 190) || $(this).val().indexOf('.') !== -1 && event.keyCode == 110)//Allow only one time decimal to input
event.preventDefault();
});
Jsfiddle
$(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();
}
});
});
or use this for copy, cut and paste by keyboard
$(function() {$('#staticParent').on('keydown', '#child', function(e)-1!==$.inArray(e.keyCode,46,8,9,27,13,110,190])||/65|67|86|88/.test(ekeyCode)&&(!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()});
})
<div id="staticParent">
<input id="child" type="textarea" />
</div>

How to create a textbox in html to accept only real number using jquery?

$("#chartModal").keypress( function (e) {
if (e.which != 8 && e.which != 0 && e.which != 43 && e.which != 45 && e.which != 46 && (e.which < 48 || e.which > 57)) {
return false;
}
});
This accept +, - & . in between the number, which is not a number.
Try with this
$(document).ready(function () {
$('#chartModal').keypress(function(e) {
var key = e.charCode || e.keyCode || 0;
var keychar = String.fromCharCode(key);
if ( ((key == 8 || key == 9 || key == 46 || key == 35 || key == 36 || (key >= 37 && key <= 40)) && e.charCode==0) /* backspace, end, begin, top, bottom, right, left, del, tab */
|| (key >= 48 && key <= 57) ) { /* 0-9 */
return;
} else {
e.preventDefault();
}
});
});
Here is an example:
$('#chartModal').keypress(function(e){
if (e.which != 8 && e.which != 0 &&e.which!= 43 && e.which!=45 && e.which !=46 &&(e.which < 48 || e.which > 57)) {
return false;
}
var charCode = e.which;
var value=$(this).val();
if(charCode==43 && value.indexOf('+')>=0) //Check whether a + is already there at beginning
return false;
if (charCode == 45 && value.indexOf('-') >= 0)//Check whether a - is already there at beginning
return false;
if (charCode == 46 && value.indexOf('.')!=-1)//Check at least one . is present in the number
return false;
});
Replace #idname with id of input.

how to enter only numeric values in ipad text box?

I have a problem restricting a text box to only numeric values. I used normal methods but it works only in windows, not working in ipod and it allows a user to enter strings and special characters. , if you know how to restrict this on iOS pls help ,
check it....
if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || event.keyCode == 116 ||
(event.keyCode == 65 && event.ctrlKey === true) ||
((event.keyCode >= 35 && event.keyCode <= 45) || event.keyCode == 190 || event.keyCode == 100 || event.keyCode == 110)) {
if ((event.keyCode == 190 || event.keyCode == 100 || event.keyCode == 110) && $(this).val().indexOf('.') != -1) {
event.preventDefault();
}
else {return;}
}
else {
// Ensure that it is a number and stop the keypress
if ((event.keyCode >= 219 && event.keyCode <= 222) || (event.keyCode >= 106 && event.keyCode <= 109) || event.keyCode == 111
|| event.keyCode == 32 || event.keyCode == 59 || (event.keyCode >= 186 && event.keyCode <= 189) || event.keyCode == 191 || event.keyCode == 192 ||
event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || (event.keyCode > 105 && event.keycode < 190 )) ){
/*
if (checker.apple) {
// alert('Hh');
alert(event.keyCode);
//$.browser.apple=true;
event.shiftKey || (event.keyCode <= 48 || event.keyCode >= 57) && (event.keyCode < 96 || (event.keyCode > 105 && event.keycode < 190 ))
event.preventDefault();
}*/
//alert(event.keyCode);
/*event.preventDefault();
}
}
Limit the user to only type In Numbers:
- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
{
if ([string length] == 0 && range.length > 0)
{
textField.text = [textField.text stringByReplacingCharactersInRange:range withString:string];
return NO;
}
NSCharacterSet *nonNumberSet = [[NSCharacterSet characterSetWithCharactersInString:#"0123456789"] invertedSet];
if ([string stringByTrimmingCharactersInSet:nonNumberSet].length > 0)return YES;
return NO;
}
You can use onkeypress() when user presses any button and fire checkAlpha() function.
and use following code to detect whether it is a number or a alphabet
function checkAlpha() {
x = event.charCode;
if (( x >= 65 && x <=90) || (x >= 97 && x <=122))
{
alert("Yes, it is alphabet");
}
else
{
alert("Sorry, only alphabet allowed");
event.preventDefault();
}
}
works fine latest android and desktop please confirm on apple devices and let me know.
please follow this code for enter only numeric value in text box. make sure for these DELEGATE methods
- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string {
char *x = (char*)[string UTF8String];
//if(DEBUG_MODE) NSLog(#"char index is %i",x[0]);
if([string isEqualToString:#"0"] || [string isEqualToString:#"1"] || [string isEqualToString:#"2"] || [string isEqualToString:#"3"] || [string isEqualToString:#"4"] || [string isEqualToString:#"5"] || [string isEqualToString:#"6"] || [string isEqualToString:#"7"] || [string isEqualToString:#"8"] || [string isEqualToString:#"9"] || x[0]==0 ) {
NSUInteger newLength = [textField.text length] + [string length] - range.length;
return (newLength > 6) ? NO : YES;
} else {
return NO;
}
}

Categories