Develop Reference

Javascript - Disable Key Down selectively

My application has a image palette. I am using key board shortcuts to move next and previous images. The following is the code:
window.addEventListener('keydown', function(e) {
if (e.which == 37 || e.which == 65) {
beforeAfterImages(1);
gtfval();
}
if(e.which == 39 || e.which == 68) {
beforeAfterImages(2);
gtfval();
}
})
In the same page, I have a button, that opens a modal window. The modal window has fields for text input. During text input When I press a or d the image palette behind the modal keeps moving. Can I disable the keydown functions, when I open the modal window. I tried the following:
$('#myModal').click(function() {
window.addEventListener('keydown', function(e) {
if (e.which == 37 || e.which == 65) {
return false;
}
if(e.which == 39 || e.which == 68) {
return false;
}
})
});

When you open the modal, you can edit a variable, like var isModalOpen. Then check that everytime the user presses the keys:
window.addEventListener('keydown', function(e) {
if(modalIsOpen) return; // this
if (e.which == 37 || e.which == 65) {
beforeAfterImages(1);
gtfval();
}
if(e.which == 39 || e.which == 68) {
beforeAfterImages(2);
gtfval();
}
})

Disable enter key and space if iframe body is empty onload

How to check if iframe content is empty then then disable "enter key" and "space"
else if Enable.
DEMO HERE
var iframeContainerVal = $("#textEditor").contents().find("body").text();
var container = document.getElementById("textEditor").contentWindow;
function checkPress(){
alert('In Fn')
$(container).keypress(function(event){
if (event.keyCode == 10 || event.keyCode == 13 || event.keycode == 32 ) {
alert('aaa');
event.preventDefault();
}
});
}
if(iframeContainerVal == true) {
checkPress()
}
else {
alert('false')
}

Use return false;
function checkPress(){
alert('In Fn')
$(container).keypress(function(event){
if (event.keyCode == 10 || event.keyCode == 13 || event.keyCode == 32 ) {
return false;
}
});
}
you used event.keycode == 32 in your If statement But, it should capital C in keycode like
event.keyCode == 32

Check for iframe empty content , iframe id = 'if'
if ($('#iframe').contents().find('body').children().length == 0) {
alert('I frame is empty');
if (event.keyCode == 32 || event.keyCode == 13) {
return false;
}
}

Bind ctrl + u keystroke in jQuery

I am trying to build a hotkey into my web application in jQuery. I am trying to bind the Ctrl+U key stroke. Here is what I have:
$(document).keypress(function(e) {
if(e.ctrlKey && e.which == 117) {
if($("#nav-user-details").length > 0) {
$("#nav-user-details").find(".dropdown-menu").toggle();
}
}
});
This is not working though. How do I bind this key strokes?
Thanks.

Try this please http://jsfiddle.net/TN7GZ/
Press Ctrl+U and the screen will alert.
This will fit your need :)
Code
var isCtrl = false;
document.onkeyup=function(e){
if(e.which == 17) isCtrl=false;
}
document.onkeydown=function(e){
if(e.which == 17) isCtrl=true;
if(e.which == 85 && isCtrl == true) {
//run code for CTRL+U -- ie, whatever!
alert('CTRL + U stuff');
return false;
}
}
​

I’m pretty sure 85 is the keycode for u, or am I missing something?
If you want mac support as well (the command key), it can get messy. I wrote a snippet before that might help you, but it involves browser detections (yuck):
var cmd = false;
$(document).on('keydown', function(e) {
if(detectMacCommand(e.which)) {
cmd = true;
return;
}
// now detect print (ctr/cmd + p)
if ( e.which == 85 && ( e.ctrl || cmd ) ) {
e.preventDefault();
alert('ctrl/cmd + u');
}
}).on('keyup', function(e) {
if(detectMacCommand(e.which)) {
cmd = false;
return;
}
});
function detectMacCommand(key) {
return ( $.browser.mozilla && key == 224 ||
$.browser.opera && key == 17 ||
$.browser.webkit && ( key == 91 || key == 93 ));
}
Demo: http://jsbin.com/afijam/2

$(document).keypress("u",function(e) {
if(e.ctrlKey)
alert("Ctrl+U was pressed!!");
});

You'll have to use keydown instead of keypress. Keypress does not trigger for non-char keys.
$(document).keydown(function (e) {
if (e.ctrlKey && e.which === 81) {
alert("key pressed");
return false;
}
});

Try this:
var prevKey = null;
$(document).keydown(function (e) {
var thisKey = e.which;
if (prevKey && prevKey == 17) {
if (thisKey == 85) {
// Your code.
}
}
prevKey = thisKey;
});

If you are working in a Xhtml file and you get an error The entity must immediately follow the & then you should use &&& instead of &&.

Telerik RadTextBox ValueChanged event and window.onbeforeunload

I have the following javascript on my page:
var isDirty = false;
function OnTextBoxValueChanged(sender, args)
{
isDirty = true;
}
window.onbeforeunload = function ()
{
if (isDirty)
{
return 'You have unsaved changes on the form.';
}
}
OnTextBoxValueChanged is the handler for RadTextBox's corresponding client event.
if user changes text in textbox, then moves focus to any other element and then presses 'close tab' in browser - confirmation window appears. This is correct. But the problem appears when user changes text and then immediately presses 'close tab'. In this case onbeforeunload event fires before onvaluechanged and isDirty variable has incorrect value (false) in onbeforeunload handler.
Am I doing something wrong or is there a workaround for my case?

It seems like that the only workaround in my case is usage of KeyPress event and filtering system keys (tab, enter etc.)
function OnKeyPress(sender, args)
{
if (!IsSysKey(sender, args))
{
isDirty = true;
}
}
function IsSysKey(sender, args)
{
var kc = args.get_keyCode();
return ((kc == 9) || (kc == 13) || (kc == 19) || (kc == 27) ||
(kc == 45) ||
(kc >= 33 && kc <= 40) ||
(kc >= 91 && kc <= 93) ||
(kc >= 112 && kc <= 123) ||
((kc == 8) && (sender.get_caretPosition() == 0) &&
(sender.get_caretPosition()[1] == undefined)) ||
((kc == 46) && (sender.get_caretPosition() == sender.get_value().length) &&
(sender.get_caretPosition()[1] == undefined)));
}

javascript : key validation

im using javascript to validate keys in textbox. it is not working :(
function numeric(e) {
return ((e.keyCode == 8) ||
(e.keyCode == 9) ||
(e.keyCode > 47 && e.keyCode < 58) ||
(e.keyCode > 36 && e.keyCode < 41) ||
(e.keyCode == 46) ||
(e.keyCode > 95 && e.keyCode < 106) ||
e.keyCode == 190 ||
e.keyCode == 110);
}
help me...

function numeric(e) {
e = e || window.event;
keycode = e.keyCode || e.which;
if(keycode === 13){
alert("cheese");
}
}

I know that in I.E. you can set event.keyCode=0 to suppress the key appearing in the control. But I think you need to trap the onkeydown. Firefox might have an equivalent. This is good because it prevents the key actually "arriving" at the control.
Also keep in mind that you might need to handle combinations of Shift + key and alt + key.
a good debug technique for this sort of thing is to say windows.status = event.keyCode,
and you can see what the keycode is as you type it...

Just try out the following code. I have checked F5 keycode, you can check as you want
function disableKey(event)
{
if (!event) event = window.event;
if (!event) return;
var keyCode = event.keyCode ? event.keyCode : event.charCode;
if (keyCode == 116) {
showMsg("This functionality is disabled.");
window.status = "F5 key detected! Attempting to disabling default response.";
window.setTimeout("window.status='';", 2000);
// Standard DOM (Mozilla):
if (event.preventDefault) event.preventDefault();
//IE (exclude Opera with !event.preventDefault):
if (document.all && event && !event.preventDefault) {
event.cancelBubble = true;
event.returnValue = false;
event.keyCode = 0;
}
return false;
}
}
function setEventListenerForFrame(eventListener)
{
document.getElementById('your_textbox').onkeydown = eventListener;
//frames['frame'].document.onkeypress = eventListener;
}
<body onload="setEventListener(disableKey);">

Try this if you want a numbers only textbox:
function numbercheck(event) {
var unicode = event.charCode; var unicode1 = event.keyCode; if (navigator.userAgent.indexOf("Firefox") != -1 || navigator.userAgent.indexOf("Safari") != -1) {
if (unicode1 != 8) {
if ((unicode >= 48 && unicode <= 57) || unicode1 == 37 || unicode1 == 39 || unicode1 == 35 || unicode1 == 36 || unicode1 == 9 || unicode1 == 46)
{ return true; }
else
{ return false; }
}
}
if (navigator.userAgent.indexOf("MSIE") != -1 || navigator.userAgent.indexOf("Opera") == -1) {
if (unicode1 != 8) {
if (unicode1 >= 48 && unicode1 <= 57)
{ return true; }
else
{ return false; }
}
}
}
And in your textbox call it on the onkeypress event:
onkeypress="return numbercheck(event)"