'Enter key pressed' event, form submit, Page_Load, __postback in .NET

Posted on 2004-09-22
Last Modified: 2011-08-18

I am using C#.NET to create some simple web pages. I noticed that 'enter_key_pressed' (window.event.keyCode == 13) will cause the postback to the server. I know I can link this event to the button_click, but have to cancel the event like:

if (window.event.keyCode == 13) {
           event.cancel = true;

Otherwise the page will be submitted twice (right?).

My question is how the 'Enter key pressed' causes the postback? I wrote a simple page to test, it didn't mean like whenever there's page, pressing the enter key would cause the form to submit. Also, I didn't see other event_handler was called in Page_Load upon pressing the enter key. So seems to me that the submit wasn't thru a default button clicking. It must be wired into some JavaScript functions created by .NET on the backend without my permission. If so, can I disable it?

What if there are more than one form, which one to submit then?

Is there a way to catch this event, or to distinguish this event from a real button_click event on the Page_Load() function? So instead of doing on client side, I can explicitly call the handler on the server-side?

Thanks a lot.

Question by:ds869
  • 3
  • 2
  • 2
  • +1
LVL 24

Accepted Solution

Justin_W earned 75 total points
ID: 12129287
>> My question is how the 'Enter key pressed' causes the postback?
It is part of IE's built-in behavior.  The standards don't really specify exactly how browsers are required to handle Enter, but it usually depends on the type and number of form input tags in the page.  You can capture and cancel the event using a OnKeyDown handler on the <body> tag if you want to prevent it completely.

Expert Comment

ID: 12130515
4 open questions:
09/23/04 "'Enter key pressed' event, form submit, ..."
09/14/04 "Server-side Validator.IsValid value is a..."
10/10/03 "How to add user defined functions (UDF) ..."
07/22/03 "Can't open a remote file which is on sha..."

Please maintain your old Questions
LVL 10

Expert Comment

ID: 12130801

When you create a FORM tag and put text boxes and a submit button, the browser will usually treat the Enter key as a command to submit the form.  It is as if you are calling the submit() method of the form object in JavaScript.

Depending on what controls you have on your page, ASP.NET might write a JavaScript function called __doPostBack() into your page.  The controls that do that use it to send information about the control and the postback to the server by putting that data in the __EVENTTARGET and __EVENTARGUMENT hidden text box fields that are also added to the HTML.  Then __doPostBack calls the submit() method of the form object.  So no, you are not necessarily posting the page back twice by hitting the enter key.  I can see some situations where you would not want the enter key to cause a postback and you can cacnel the event as you show in your question, but unless there is a reason to do so, it should not be necessary.

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.


Author Comment

ID: 12134564
Thaks all.

I realized that I also have a couple of ImageButton controls on the page in the form of <input type='image'>. When I removed them from the form along with <input type=submit>, pressing the 'Enter' key won't trigger the form.submit().

Is there a way to set the imagebutton as 'input' intead of 'submit', e.g. using <input type='button'> instead of <input type='submit'> ? And although the imagebutton did trigger the form.submit, its event handler at the server-side wasn't called. Why?

The reason that pressing the Enter key submits the form twice is that I linked this event to a which will submit the form, and it also triggers one of the imagebutton to submit the form, again. Those image button is for sorting the table only, which will be done at the server-side.

No one seems interested in answering my last question:

>Is there a way to catch this event, or to distinguish this event from a real button_click event on the Page_Load() function? So instead of >doing on client side, I can explicitly call the handler on the server-side?

Thanks again.



Author Comment

ID: 12134812
So, if there's a submit button or an image button, the form will be submitted by enter.key.pressed, BUT not thru either one of the buttons, and the button's event handler at the server side won't be called. Is this right?

Author Comment

ID: 12135121
If I add the onClick to image button, like

<input type="image" name="te" id="te" src="./images/up.gif"  onClick="alert(event.keyCode)">

the event.keyCode is always 0, no matter I clicked on the image button or anywhere on the form.

Can anybody tell me why?

LVL 10

Assisted Solution

jnhorst earned 75 total points
ID: 12135761
If you are clicking on a button or somewhere on the form, keyCode will be 0 because no key has been pressed on the keyboard.  KeyCode is for keyboard input, not mouse input.

What event handler are you referring to when you say it isn't being fired?  I added an image button to a form with nothing else on it and then did this in the Page_Load event.

if (!this.IsPostBack)
     this.ImageButton1.Attributes.Add("onclick", "javascript:alert(\"This is a test.\");");
     this.ImageButton1.Attributes.Add("onkeydown", "javascript:alert(\"KeyCode is \" + event.keyCode);");

I got the alert, clicked OK and the postback fired and the server-side click event executed.  If I tabbed the button into focus and hit the enter key I got my key code alert, then the onclick event fired and then the page posted to the server firing the server-side click event.

LVL 24

Expert Comment

ID: 12135806
>Is there a way to catch this event,
I answered this above.

>or to distinguish this event from a real button_click event on the Page_Load() function?
No, not without catching the event on the client side.

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
This Micro Tutorial will give you a basic overview how to record your screen with Microsoft Expression Encoder. This program is still free and open for the public to download. This will be demonstrated using Microsoft Expression Encoder 4.
This Micro Tutorial demonstrates using Microsoft Excel pivot tables, how to reverse engineer competitors' marketing strategies through backlinks.

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question