Batalf
asked on
Key-event which executes a submit-button
I have a form with different submit-buttons.
What I'm looking for is a way to execute one of this buttons with keyboard-combinations. For instance, I would like the
<input type="submit" name="save" value="save">
button to be executed when I click "Ctrl+C".
Other keycode-combinations should execute other submit-buttons.
The solution only needs to work on IE on PC's.
Thanks in advance
Batalf
What I'm looking for is a way to execute one of this buttons with keyboard-combinations. For instance, I would like the
<input type="submit" name="save" value="save">
button to be executed when I click "Ctrl+C".
Other keycode-combinations should execute other submit-buttons.
The solution only needs to work on IE on PC's.
Thanks in advance
Batalf
here's some simple code
<HTML>
<HEAD>
<style>
TD {
cursor:default;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
var key = new Array();
key['1'] = "page1.html";
key['2'] = "page2.html";
key['3'] = "page3.html";
key['c'] = "page67.html";
function getKey(keyStroke) {
isNetscape=(document.layer s);
eventChooser = (isNetscape) ? keyStroke.which : event.keyCode;
which = String.fromCharCode(eventC hooser).to LowerCase( );
// alert(eventChooser);
for (var i in key)
if (event.ctrlKey && which == i) {
window.location = key[i];
i=key.length+1;
}
else if(eventChooser == 13) {
//load page1.html if enter key pressed
window.location = key[i];
i=key.length+1;
}
}
document.onkeydown = getKey;
// -->
</SCRIPT>
</HEAD>
<BODY>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=3 BGCOLOR="THREEDFACE" bordercolor="threedface">
<TR>
<TD onmouseout="this.style.bor derColor=' '" onmouseover="this.style.bo rderColor= 'black'">P age<U>1</U ></TD>
<TD onmouseout="this.style.bor derColor=' '" onmouseover="this.style.bo rderColor= 'black'">P age<U>2</U ></TD>
<TD onmouseout="this.style.bor derColor=' '" onmouseover="this.style.bo rderColor= 'black'">P age<U>3</U ></TD>
<TD onmouseout="this.style.bor derColor=' '" onmouseover="this.style.bo rderColor= 'black'">P age<U>C</U ></TD>
</TR>
</TABLE>
</BODY>
</HTML>
hope this helps
nzjonboy
<HTML>
<HEAD>
<style>
TD {
cursor:default;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
var key = new Array();
key['1'] = "page1.html";
key['2'] = "page2.html";
key['3'] = "page3.html";
key['c'] = "page67.html";
function getKey(keyStroke) {
isNetscape=(document.layer
eventChooser = (isNetscape) ? keyStroke.which : event.keyCode;
which = String.fromCharCode(eventC
// alert(eventChooser);
for (var i in key)
if (event.ctrlKey && which == i) {
window.location = key[i];
i=key.length+1;
}
else if(eventChooser == 13) {
//load page1.html if enter key pressed
window.location = key[i];
i=key.length+1;
}
}
document.onkeydown = getKey;
// -->
</SCRIPT>
</HEAD>
<BODY>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=3 BGCOLOR="THREEDFACE" bordercolor="threedface">
<TR>
<TD onmouseout="this.style.bor
<TD onmouseout="this.style.bor
<TD onmouseout="this.style.bor
<TD onmouseout="this.style.bor
</TR>
</TABLE>
</BODY>
</HTML>
hope this helps
nzjonboy
Here is an article that shows you how to capture the pressed key:
http://developer.irt.org/script/1214.htm
http://developer.irt.org/script/1214.htm
ASKER
I know how to use event.keyCode, event.ctrlKey, but how could I use this to submit the form?
And not by the submit() function because I have several submit-buttons, all identified by different names.
And not by the submit() function because I have several submit-buttons, all identified by different names.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
I was thinking that you could create a JavaScript that would dynamically change the action of the form and the value of the submit button and then execute the submit button; in effect, simulating the click event of your different buttons.
Fritz the Blank
Fritz the Blank
ASKER
The action of my form is all to the same page, but based on which submit-button the user pressed, different actions will be executed by serverside-scripts.
I have found a temporary solution, where I use hidden variables<input type="Hidden"> and set a value to them based on which keyboard-shortcut the user pressed. Then I called forms[0].submit(). Then I know I know in my serverside-script what to do based on this hidden-variable.
For instance, if the user presses Ctrl+S, I set the hidden-variable to "S". Then I Submit the page using submit().
Isn't there a simpler way of doing this?
Batalf
I have found a temporary solution, where I use hidden variables<input type="Hidden"> and set a value to them based on which keyboard-shortcut the user pressed. Then I called forms[0].submit(). Then I know I know in my serverside-script what to do based on this hidden-variable.
For instance, if the user presses Ctrl+S, I set the hidden-variable to "S". Then I Submit the page using submit().
Isn't there a simpler way of doing this?
Batalf
The only thing that I can think of is to set the hidden variable to the value of the submit button in question regardless of whether a shortcut is used or if the button is clicked. That way, you need only interogate the hidden field to pass the parameter back to the page.
Fritz the Blank
Fritz the Blank
Didi you try my code?
I am wondering if you can use the onKeyPress event to capture what keystrokes are pressed, and then use this information to either fire the appropriate button, or at the very least, change the action of the form and the value of the submit button and then submit the form.
Fritz the Blank