[ENTER] key causing major headaches.

[Eric]

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the transition for
me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things: add a
"Category", or add a "Movie Title" to an already existing category. This is
just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click event of
the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that case, I
obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One <form>
would encapsulate the widgets for entering a category and a second <form>
would encapsulate the widgets for entering a movie. Each of the two <form>
tags would contain a <input type="hidden"> element containing a name/value
pair indicating which form was submitted on postback.

In ASP.NET, I see no way to emulate this concept. ASP.NET does not let me
have two form tags (with runat="server" defined). And, if I use a
client-side (traditional) <form>, I cannot use any of the ASP.NET web
controls (like <aspropDownList>, etc.). Not being able to use these web
controls, to me, defeats the whole purpose of using ASP.NET. If I revert
back to a traditional <form> tag, I don't get events, viewstates, or any
other fancy ASP.NET features.

This concept (of having two forms) is extremely important to me. What do I
do!? Any and all help is very much appreciated!!


Regards,

Eric

 

[Mythran]

As you can do in Legacy ASP, try client-side script to control the OnKeyPress
event of the form elements you want to capture the ENTER key for and simulate a
button-click event for the element you want to click

Mythran

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the transition for
me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things: add a
"Category", or add a "Movie Title" to an already existing category. This is
just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click event of
the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that case, I
obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One <form>
would encapsulate the widgets for entering a category and a second <form>
would encapsulate the widgets for entering a movie. Each of the two <form>
tags would contain a <input type="hidden"> element containing a name/value
pair indicating which form was submitted on postback.

In ASP.NET, I see no way to emulate this concept. ASP.NET does not let me
have two form tags (with runat="server" defined). And, if I use a
client-side (traditional) <form>, I cannot use any of the ASP.NET web
controls (like <aspropDownList>, etc.). Not being able to use these web
controls, to me, defeats the whole purpose of using ASP.NET. If I revert
back to a traditional <form> tag, I don't get events, viewstates, or any
other fancy ASP.NET features.

This concept (of having two forms) is extremely important to me. What do I
do!? Any and all help is very much appreciated!!


Regards,

Eric

 

[Eric]

Yeah... I figured I might have to do something like this, but honestly, I
hate the idea that if the client has javascript disabled (or doesn't support
it) then the page is not-only non-functional but actually functions
incorrectly (forms are submitted with no server-side code to handle it).

Thanks for the suggestion. I don't think there will be another way!

Eric

As you can do in Legacy ASP, try client-side script to control the OnKeyPress
event of the form elements you want to capture the ENTER key for and simulate a
button-click event for the element you want to click

Mythran

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the transition for
me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things: add a
"Category", or add a "Movie Title" to an already existing category. This is
just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click event of
the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that case, I
obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One

would encapsulate the widgets for entering a category and a second

would encapsulate the widgets for entering a movie. Each of the two

tags would contain a <input type="hidden"> element containing a name/value
pair indicating which form was submitted on postback.

In ASP.NET, I see no way to emulate this concept. ASP.NET does not let me
have two form tags (with runat="server" defined). And, if I use a
client-side (traditional) <form>, I cannot use any of the ASP.NET web
controls (like <aspropDownList>, etc.). Not being able to use these web
controls, to me, defeats the whole purpose of using ASP.NET. If I revert
back to a traditional <form> tag, I don't get events, viewstates, or any
other fancy ASP.NET features.

This concept (of having two forms) is extremely important to me. What do I
do!? Any and all help is very much appreciated!!


Regards,

Eric

 

[Eric]

Well Everyone,

I believe I've stumbled upon an acceptable solution. For the
curious-minded...

An obvious solution would be to disable the [ENTER] button entirely. Doing
this with javascript however, is a problem becaue if the client has
javascript disabled or doesn't support it you will still get the same "ghost
postbacks" where the source (clicked button) is unknown.

My solution is to do this with an image instead of a button. To do this,
create a <asp:LinkButton> object and set its Text property to be the HTML
for an <img>. You can then use the Click event of the LinkButton object. I
didn't think this would work for quite a while (because when I tested it, it
didn't work). As it turns out, the reason my tests resulted in failure is
because of bug in Internet Explorer...

It turns out that if you have a <form> with less than two text boxes IE
automatically submits the form when the [ENTER] key is pressed. This
happens WHETHER OR NOT you have a submit button in the <form>. If you have
2 OR MORE text boxes, IE will NOT automatically submit the form when [ENTER]
is pressed. Instead, it will CLICK the first button it encounters following
the widget with the focus. This latter behavior is what *should* occur
regardless of the number of text boxes. So... to use my <asp:LinkButton>
solution, you ALSO have to have at least 2 text boxes in the <form>. If
your application only calls for one (or zero), you must supplement the
"missing" text box(es) with hidden text box(es). This could be accomplished
by using CSS to set the visibility to hidden, the width to 0, or both.

Jumping through these hoops will give you the expected behavior. My next
step will be to derive my own "ImageButton" control (from asp:LinkButton)
that includes the hidden text boxes. It may also accept an alternate
MouseoverImage property to emulate the appearance of an actual button (using
*optional* client-side javascript).

If some jaded soul out there winds up as stuck as I was, I hope this
solution finds them!


Regards,

Eric

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the transition for
me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things: add a
"Category", or add a "Movie Title" to an already existing category. This is
just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click event of
the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that case, I
obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One

 

[Mythran]

IN-LINE COMMENTS:

Well Everyone,

I believe I've stumbled upon an acceptable solution. For the
curious-minded...

That's Me! 0>8-{P

An obvious solution would be to disable the [ENTER] button entirely. Doing
this with javascript however, is a problem becaue if the client has
javascript disabled or doesn't support it you will still get the same "ghost
postbacks" where the source (clicked button) is unknown.

The source (clicked button) is unknown for a very good reason. There is no
button clicked It is the default for HTML forms. It does an automatic submit
of the form w/o any buttons being clicked.

My solution is to do this with an image instead of a button. To do this,
create a <asp:LinkButton> object and set its Text property to be the HTML
for an <img>. You can then use the Click event of the LinkButton object. I
didn't think this would work for quite a while (because when I tested it, it
didn't work). As it turns out, the reason my tests resulted in failure is
because of bug in Internet Explorer...

<script language="JavaScript">
function Element_OnKeyPress(e)
{
if (!e) {
e = window.event;

if (!e) {
alert('Could not get the event object!');
}
}

var srcElement = e.srcElement;
// Code to detect which button to simulate clicking.

}
</script>

In the elements that are problematic, add the onkeypress event (Example:

<input type="text" onkeypress="JavaScript:Element_OnKeyPress(event);">

May want to double check e.srcElement. Can't remember if other browsers support
it or not...

It turns out that if you have a <form> with less than two text boxes IE
automatically submits the form when the [ENTER] key is pressed. This
happens WHETHER OR NOT you have a submit button in the <form>. If you have
2 OR MORE text boxes, IE will NOT automatically submit the form when [ENTER]
is pressed. Instead, it will CLICK the first button it encounters following
the widget with the focus. This latter behavior is what *should* occur
regardless of the number of text boxes. So... to use my <asp:LinkButton>
solution, you ALSO have to have at least 2 text boxes in the <form>. If
your application only calls for one (or zero), you must supplement the
"missing" text box(es) with hidden text box(es). This could be accomplished
by using CSS to set the visibility to hidden, the width to 0, or both.

Hrm, yer right...and I knew this but it didn't come to my mind earlier.

Jumping through these hoops will give you the expected behavior. My next
step will be to derive my own "ImageButton" control (from asp:LinkButton)
that includes the hidden text boxes. It may also accept an alternate
MouseoverImage property to emulate the appearance of an actual button (using
*optional* client-side javascript).

If some jaded soul out there winds up as stuck as I was, I hope this
solution finds them!


Regards,

Eric

Regards,

Mythran

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the transition for
me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things: add a
"Category", or add a "Movie Title" to an already existing category. This is
just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click event of
the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that case, I
obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One

would encapsulate the widgets for entering a category and a second <form>
would encapsulate the widgets for entering a movie. Each of the two

tags would contain a <input type="hidden"> element containing a name/value
pair indicating which form was submitted on postback.

In ASP.NET, I see no way to emulate this concept. ASP.NET does not let me
have two form tags (with runat="server" defined). And, if I use a
client-side (traditional) <form>, I cannot use any of the ASP.NET web
controls (like <aspropDownList>, etc.). Not being able to use these web
controls, to me, defeats the whole purpose of using ASP.NET. If I revert
back to a traditional <form> tag, I don't get events, viewstates, or any
other fancy ASP.NET features.

This concept (of having two forms) is extremely important to me. What do I
do!? Any and all help is very much appreciated!!


Regards,

Eric

 

[Eric]

Thanks! However, scenarios where javascript is disabled/not available on
the client would result in unexpected (rather, annoying and
hard-to-program-for) behavior (events would never get fired). I'd much
rather the page require javascript or simply not function at all.
Furthermore (a more minor thing), my demanding (lazy) nature requires that I
don't have to do a lot of work (like putting a keypress event in every
textbox). How about this:

http://www.ejproductions.com/downloads/ejimagebutton.zip

There's a DLL in there for your /bin directory, a sample ASPX file and a few
images. The ZIP file is a hair over 6K. If you're scared of my DLL (I
don't blame you), I included the ".vb" source file so that anyone can
compile it themselves. I'm pleased with this solution and - woo hoo! - it's
my first ever composite control!

Thanks again Mythran for your interest and assistance!!

Eric

IN-LINE COMMENTS:

Well Everyone,

I believe I've stumbled upon an acceptable solution. For the
curious-minded...

That's Me! 0>8-{P

An obvious solution would be to disable the [ENTER] button entirely. Doing
this with javascript however, is a problem becaue if the client has
javascript disabled or doesn't support it you will still get the same "ghost
postbacks" where the source (clicked button) is unknown.

The source (clicked button) is unknown for a very good reason. There is no
button clicked It is the default for HTML forms. It does an automatic submit
of the form w/o any buttons being clicked.

My solution is to do this with an image instead of a button. To do this,
create a <asp:LinkButton> object and set its Text property to be the HTML
for an <img>. You can then use the Click event of the LinkButton object. I
didn't think this would work for quite a while (because when I tested it, it
didn't work). As it turns out, the reason my tests resulted in failure is
because of bug in Internet Explorer...

<script language="JavaScript">
function Element_OnKeyPress(e)
{
if (!e) {
e = window.event;

if (!e) {
alert('Could not get the event object!');
}
}

var srcElement = e.srcElement;
// Code to detect which button to simulate clicking.

}
</script>

In the elements that are problematic, add the onkeypress event (Example:

<input type="text" onkeypress="JavaScript:Element_OnKeyPress(event);">

May want to double check e.srcElement. Can't remember if other browsers support
it or not...

It turns out that if you have a <form> with less than two text boxes IE
automatically submits the form when the [ENTER] key is pressed. This
happens WHETHER OR NOT you have a submit button in the <form>. If you have
2 OR MORE text boxes, IE will NOT automatically submit the form when [ENTER]
is pressed. Instead, it will CLICK the first button it encounters following
the widget with the focus. This latter behavior is what *should* occur
regardless of the number of text boxes. So... to use my

solution, you ALSO have to have at least 2 text boxes in the <form>. If
your application only calls for one (or zero), you must supplement the
"missing" text box(es) with hidden text box(es). This could be accomplished
by using CSS to set the visibility to hidden, the width to 0, or both.

Hrm, yer right...and I knew this but it didn't come to my mind earlier.

Jumping through these hoops will give you the expected behavior. My next
step will be to derive my own "ImageButton" control (from asp:LinkButton)
that includes the hidden text boxes. It may also accept an alternate
MouseoverImage property to emulate the appearance of an actual button (using
*optional* client-side javascript).

If some jaded soul out there winds up as stuck as I was, I hope this
solution finds them!


Regards,

Eric

Regards,

Mythran

Hi All,

I'm very experienced in traditional ASP and am new to (am learning) ASP.NET.
FYI: I am initially learning ASP.NET with VB.NET to ease the

transition
for

me. I have encountered what I believe to be a huge limitation with ASP.NET
and I'm wondering how you have handeled this problem.

Let's suppose you have a page where the user can do one of two things:

add
a

"Category", or add a "Movie Title" to an already existing category.

This
is

just a make-believe scenario that I'm using to make a point: You have two
distinct sections to your page... one section contains a text box and a
button (for adding a new category) and another section contains a dropdown
menu of categories, a text box, and a different button (for adding a new
movie title).

You can have have the Click event of the first button ("bAddCategory")
handle the addition of the new category, and you can have the Click

event
of

the second button ("bAddMovie") add the new movie title. So far, so good.

My problem is this: what if the user presses the [ENTER] key on his/her
keyboard? Doing this does not fire either Click event. I can (in essence)
make a "default" button by adding the following to the server-side Load
event for the page:

Page.RegisterHiddenField("__EVENTTARGET", bAddMovie.ClientID)

Doing this will cause the Click event for bAddMovie to fire when the user
presses [ENTER]. However... I don't want bAddMovie to be the default button
if the user is in the process of typing a new category name (in that

case,
I

obviously would want bAddCategory to be the default).

In traditional ASP, I would simply have two <form>s on the page. One

would encapsulate the widgets for entering a category and a second

would encapsulate the widgets for entering a movie. Each of the two

tags would contain a <input type="hidden"> element containing a name/value
pair indicating which form was submitted on postback.

In ASP.NET, I see no way to emulate this concept. ASP.NET does not let me
have two form tags (with runat="server" defined). And, if I use a
client-side (traditional) <form>, I cannot use any of the ASP.NET web
controls (like <aspropDownList>, etc.). Not being able to use these web
controls, to me, defeats the whole purpose of using ASP.NET. If I revert
back to a traditional <form> tag, I don't get events, viewstates, or any
other fancy ASP.NET features.

This concept (of having two forms) is extremely important to me. What

do
I

do!? Any and all help is very much appreciated!!


Regards,

Eric