A Misfiring Postback and How to Fix It

Here’s a bug of a sorts that I’ve seen on a lot of sites (login screens in particular):

<asp:TextBox id="Name" runat="server" /><br />
<asp:Button id="Submit" runat="server" Text="Submit" />

Nothing fancy. A textbox and a button. The expected outcome is for the button Click event to fire server-side. Enter something in the textbox and hit Enter. The page refreshes, but nothing happens because Click never fired. It’s awfully confusing to users.

I saw an explanation for this phenomenon once, but I don’t remember it. I do remember a workaround, though:

<asp:TextBox id="Name" runat="server" /><br />
<asp:Button id="Submit" runat="server" Text="Submit" />
<input type="text" style="display: none;" />

Just add an invisible input element as shown above. Weird, I know.

Ugh. Any workarounds that don't involve cluttering up the client-side code with meaningless junk?

Yep, this one has bit me before. I would say this occurs for search forms in particular. I can't remember... is it IE at fault or ASP.NET?

Using ASP.NET's defaultbutton attribute on the will also correct this.

Oh C'mon, Milan!! HTMLEncode my message so the tags show up!

Correction:
Using ASP.NET's defaultbutton attribute on the form tag will also correct this.

Actually, it's a regex stripping unwanted HTML tags. :)

This problem only seems to occur in IE.

If you wrap the TextBox and Button with a Panel and set the DefaultButton attribute of the Panel to the Id of the Button it will work in IE.

This is an ancient bug in IE whereby the value of the submit is not included in the submitted form data. I usually set a class of "iefix" and control the appearance of the input element via an external CSS file.

@Josh Stodola: what changes in the rendered HTML when you set the defaultbutton attribute? Since I don't use the ASP.NET form elements, I don't have a handy form to play with!

I believe it gets handled thru javascript. If I am not mistaken, it will use a script tag to bring in the necessary javascript. Considering the amount of bytes that will be transmitted becuase of the script tag, it would probably be much more efficient to use the invisible textbox method. Freakin IE....

Download size is one thing, graceful degradation is another. Adding the extra form field works regardless of whether or not JS is available even if it is a less elegant solution.

It's a problem with IE. It's handling of Enter is broken, but a hidden text box has fixed it every time I've run into it. Obviously, the problem space generalizes beyond logon forms. :)

This behaviour is consistant with the W3.org html specification.

"When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form."
(extract from http://www.w3.org/MarkUp/html-spec/html-spec_8.html)

There's no problem in accepting Enter to submit the form, the error is that IE does not submit the form normally bypassing the usual submit event and ignoring any submit buttons.