Capture Enter Key in ASP.NET

[ewillyb]

Hi,

ASP.NET has some interesting behavior when the user hits the Enter key.
If there are multiple ASP:Buttons (rendered as HTML submits) on the
form, when the user hits enter, the first button's click event will
fire and the page will submit.

I have a series of pages with Previous and Next navigational Btns. The
Previous button is the first button, so when the user hits enter, the
previous page is served up. Enter should result in the NEXT page being
served up.

I would like to capture the Enter keystroke, suppress the Previous Btn
click event and call a method to trigger the Next Btn click event, thus
submitting the page correctly.

That's putting it simply. My implementation is slightly more
complicated. The Previous and Next Btns are on a user control (so they
can be used on each page). Also, on some pages, there are more buttons
and different scenarios in which an Enter Click should not result in
the page submitting at all. I basically need to capture the Enter
click so that I may then determine where the user's focus is and then
call the right handlers.

I'm pretty sure JavaScript will be needed in this solution.

Thanks!
Eric

[Scott M.]

This is not a .NET issue, it is a function of the client. You'll need to
add a client-side script that captures the onKeyPress event and checks for
the ENTER key.


<ew*****@gmail.com> wrote in message
news:11*********************@g43g2000cwa.googlegro ups.com...

Hi,

ASP.NET has some interesting behavior when the user hits the Enter key.
If there are multiple ASP:Buttons (rendered as HTML submits) on the
form, when the user hits enter, the first button's click event will
fire and the page will submit.

I have a series of pages with Previous and Next navigational Btns. The
Previous button is the first button, so when the user hits enter, the
previous page is served up. Enter should result in the NEXT page being
served up.

I would like to capture the Enter keystroke, suppress the Previous Btn
click event and call a method to trigger the Next Btn click event, thus
submitting the page correctly.

That's putting it simply. My implementation is slightly more
complicated. The Previous and Next Btns are on a user control (so they
can be used on each page). Also, on some pages, there are more buttons
and different scenarios in which an Enter Click should not result in
the page submitting at all. I basically need to capture the Enter
click so that I may then determine where the user's focus is and then
call the right handlers.

I'm pretty sure JavaScript will be needed in this solution.

Thanks!
Eric

[Ken Dopierala Jr.]

Hi,

You'll need to use Javascript. In your body tag place this:

onkeydown="CheckKey(event);"

Then do what you need to do in the CheckKey() function:

function CheckKey() {
if (event.keyCode == 13) {
document.getElementById("btnLogin").focus();
}
}

The function above tests for the Enter key. If the Enter key is pressed it
switches focus to the btnLogin button which causes the client to apply the
Enter key as if the btnLogin button had the focus to begin with. In this
case the button just does a post back. Note you could also capture the 'N'
and 'P' keys so the user could hit those to navigate. I normally capture
the Alt key and then display hot-key codes on all my buttons so users can
hit 'Alt-S' to save, 'Alt-N' for next and etc. This let's my clients use
the web app just like they would a data entry intensive Windows or Terminal
app. Good luck! Ken.

--
Ken Dopierala Jr.
For great ASP.Net web hosting try:
http://www.webhost4life.com/default.asp?refid=Spinlight
If you sign up under me and need help, email me.

<ew*****@gmail.com> wrote in message
news:11*********************@g43g2000cwa.googlegro ups.com...

Hi,

ASP.NET has some interesting behavior when the user hits the Enter key.
If there are multiple ASP:Buttons (rendered as HTML submits) on the
form, when the user hits enter, the first button's click event will
fire and the page will submit.

I have a series of pages with Previous and Next navigational Btns. The
Previous button is the first button, so when the user hits enter, the
previous page is served up. Enter should result in the NEXT page being
served up.

I would like to capture the Enter keystroke, suppress the Previous Btn
click event and call a method to trigger the Next Btn click event, thus
submitting the page correctly.

That's putting it simply. My implementation is slightly more
complicated. The Previous and Next Btns are on a user control (so they
can be used on each page). Also, on some pages, there are more buttons
and different scenarios in which an Enter Click should not result in
the page submitting at all. I basically need to capture the Enter
click so that I may then determine where the user's focus is and then
call the right handlers.

I'm pretty sure JavaScript will be needed in this solution.

Thanks!
Eric

[ewillyb]

Thanks for the info, Ken.

I'm capturing the Entery Key stroke successfully, but I can't manage to
suppress the btn click event that is ocurring on the wrong (Previous)
btn.

Here's my js:
<script language=javascript>
function captureEnterKey() {
if(event.keyCode == 13) {
alert('keycode= ' + event.keyCode);
(document.getElementById(NavStrip1.CmdNextID)).foc us();
}
}
</script>

Where NavStrip1 is my user control containing the btns. It's registered
on page like so:

<%@ Register TagPrefix="uc1" TagName="NavStrip"
Src="Controls/Wizard/NavStrip.ascx" %>

And included like so:
<uc1:navstrip id=NavStrip1 runat="server"></uc1:navstrip>

CmdNextID is a property exposing the name of the btn that I want to
fire. Like so:

public string CmdNextID {
get { return "cmdNext"; }
}

Here's the js call:

<body MS_POSITIONING="GridLayout" onkeydown="javascript:
captureEnterKey();">

The alert is being reached, but a breakpoint on the CmdNextID property
never gets hit. And, most importantly, cmdPrevious btn is firing.

Thanks,
Eric

--
Sent via .NET Newsgroups
http://www.dotnetnewsgroups.com

[ewillyb]

changed JS to:
<script language=javascript>
function captureEnterKey() {
if(event.keyCode == 13) {
alert('keycode= ' + event.keyCode);
(document.getElementById(NavStrip1.CmdNextID)).foc us();
event.returnValue = false;
}
}
</script>

SAME RESULT. Wrong btn fires.

--
Sent via .NET Newsgroups
http://www.dotnetnewsgroups.com

[Ken Dopierala Jr.]

Hi,

Try commenting out the alert() line and see if does anything. Also, keep
the alert() line commented out and put a breakpoint (debugger;) just before
this line:

(document.getElementById(NavStrip1.CmdNextID)).foc us();

Find out if document.getElementById(NavStrip1.CmdNextID) equals what it
should.

One other thing is to change this line:

(document.getElementById(NavStrip1.CmdNextID)).foc us();

To this:

document.getElementById(NavStrip1.CmdNextID).focus ();

Don't know if it will make a difference but I don't think you need the extra
set of paranthesis. If that still doesn't work then there is a good chance
that the tab strip you are using is doing the same thing you are doing now
and overriding the code you've added. Check if there is a property on it to
change which button submits when Enter is pressed. Good luck! Ken.

--
Ken Dopierala Jr.
For great ASP.Net web hosting try:
http://www.webhost4life.com/default.asp?refid=Spinlight
If you sign up under me and need help, email me.

"ewillyb" <ew*****@gmail.com> wrote in message
news:Od**************@TK2MSFTNGP14.phx.gbl...

changed JS to:
<script language=javascript>
function captureEnterKey() {
if(event.keyCode == 13) {
alert('keycode= ' + event.keyCode);
(document.getElementById(NavStrip1.CmdNextID)).foc us();
event.returnValue = false;
}
}
</script>

SAME RESULT. Wrong btn fires.

--
Sent via .NET Newsgroups
http://www.dotnetnewsgroups.com