By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,694 Members | 1,846 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,694 IT Pros & Developers. It's quick & easy.

Keypress event in Webforms?

P: n/a
Is possible to assign a click event to a button control in a Web form just
pressing the return key? Something like windows forms where you can assign
this action to a default control. For example, if I press Return, I want to
fire the button_click event even when the button is not in focus. Any
thoughts?

Thanks!

Raul
Nov 17 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Add an id and onkeydown event to your BODY tag:
<body id="theBody" onkeydown="CatchKeyPress">

Add a TargetButton attribute to your TextBox controls. Set the value of
the TargetButton attribute to the name of the button you want pressed
when the user presses Enter. Note you can assign different buttons to
different controls.

<asp:textbox id="txtFirstName" runat="server"
TargetButton="btnSetFirstName"></asp:textbox>

By setting the onkeydown attribute of the BODY tag to CatchKeyPress
we can intercept the Enter and ESC keys. Using this script, you can
specify which button to 'click' when a user presses Enter in a textbox,
by setting the TargetButton attribute on the textbox.

Add the following script to the page:

<script type="text/JavaScript">
function CatchKeyPress() {
var btnToBeClicked = null;
RemoveEnterAndEscEvents();
if(window.event.keyCode == '13') {
var ButtonName =
window.event.srcElement.getAttribute("TargetButton ");
btnToBeClicked = document.getElementById(ButtonName);
if(btnToBeClicked) {
btnToBeClicked.click();
}
}
}
function RemoveEnterAndEscEvents() {
if (event.keyCode == 13 || event.keyCode == 27) {
event.cancelBubble = true; event.returnValue = false;
}
}
theBody.onkeydown=CatchKeyPress;
</script>
I think I got most of this code from somewhere on the web, but
unfortunately I can't remember who to give proper credit to.
Joshua Flanagan
http://flimflan.com/blog
Nov 17 '05 #2

P: n/a
In article <E6**********************************@microsoft.co m>,
Ra********@discussions.microsoft.com says...
Is possible to assign a click event to a button control in a Web form just
pressing the return key? Something like windows forms where you can assign
this action to a default control. For example, if I press Return, I want to
fire the button_click event even when the button is not in focus. Any
thoughts?

Thanks!

Raul

Hey Raul,

Trapping "client-side" events in the web world is done via Javascript.

<obvious statement>

Because the web is a stateless environment you can't actually catch
events in "real-time" with your C# code becuase they happen way after
your code has fired and the user has essentially de-coupled themselves
from your server (i.e. the page has been rendered and sent to the
requesting browser).

</obvious statement>

You'll have to monitor the keypress event somehow (i.e. sticking an
"onclick" event handler in your body statement, or better yet follow the
code below), then call a javascript function that fires on the client-
side that calls the "Click()" event of the button. Of course making
this all work in both IE, Netscape, FireFox and Opera can be a
challenge. This might get you started:

in modern browsers (i.e. IE4+, Mozilla) this should be enough to
register your interest in tracking the keyboard press event:

<script language=javascript>
if(navigator.appName == "Microsoft Internet Explorer")
{
document.attachEvent("onkeypress",checkkey);
}
else if(navigator.appName == "Netscape")
{
document.addEventListener("keypress",checkkey,fals e);
}

</script>

notice that either of these cases calls a function called "checkkey"

here tis:

<script language=javascript>
function checkkey(e)
{
// this traps keystroke events, then calls the
//"keystrokeresponse" function which is more specialized
//and non-browser type aware.

if(navigator.appName == "Microsoft Internet Explorer")
{
if(event.keyCode==13)
{
event.returnValue=false;
event.cancelBubble=true;
keystrokeresponse(13);
}
}
else if(navigator.appName == "Netscape")
{
if(e.which==13)
{
e.preventDefault();
keystrokeresponse(13);
}
}

}
</script>

We're getting more specialized now. This is, in C# parlance what you
would call the delagate for the event that you subscribed to above. You
could do whatever you want here, but you'd have to write two versions,
one for IE and one for Mozilla. For me, it's easier to pipe both to a
"generic" function now that I've got the browser business sorted out.

The rest of the statements (event.returnValue=flase, e.preventDefault,
etc.) just stop the event from bubbling up to the browser and causing a
postback.

Finnally, the actual function that does the stuff you want to do when
the user presses the enter key:
<script language=javascript>

function keystrokeresponse(keycode)
{
if(keycode==13)
{
// Do some cool stuff like:
var mybutton= document.getElementById"mybutton");
mybutton.Click();
}
}
</script>
Hope this helps!

-SRC
Nov 17 '05 #3

P: n/a
In article <MP************************@news.giganews.com>, as**@asdf.com
says...
In article <E6**********************************@microsoft.co m>, <snip>

Errata:

You'll have to monitor the keypress event somehow (i.e. sticking an
"onclick" event handler in your body statement,


this should read "onkeypress", not "onclick"

Nov 17 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.