How to handle ENTER key in asp.net form?

Recently i have developed a form with few asp text boxes and few asp buttons. When user Pressed enter button in any of these asp text boxes my page is getting pose back to server I.e my asp button code is executing which i don’t want. When i tried figuring out the problem i found that this is the default behavior of Asp.net form.  By default asp.net form on enter will submit the first button here in my case i have only one button in my page, so this button onClick function is getting executed.

So i thought it will be useful to write a post on handling this ENTER key in different scenario’s in asp.net form.

Scenario 1: Disable ENTER key in asp.net form

In this scenario pressing ENTER key in any part of the page should do nothing, here is the way how you can achieve that.

  document.onkeydown = DisableEnter; 

  function DisableEnter()
  {
	return (event.keyCode!=13)
  }

In the above code i have added Keydown event to the window.document , this will make sure that when ever user press ENTER key DisableEnter function will get executed. You can use the above code to disable any key ( this case it’s 13 ENTER) in form.

Scenario 2: Disable ENTER key partially

There are many times where you want ENTER key to make that control out of focus rather than post back to server and for few controls you want it to post back. I.e in the same page for different controls pressing ENTER key should do different jobs.  This can be achieved by doing the following steps.

Add onKeyDown event to all the controls where you want the control to be out of focus, and then

   onkeydown = validateEnter(control) 

    function validateEnter(control)
    {
        var ctrl = document.getElementById(control);
        if ( event.keyCode == 13)
        {
            //make your control what ever you want.
            return false;
        }
        return true;
    }

You have one asp text box where user need to enter valid data and few other text boxes where there is no validation. On ENTER key pressed you need to validate the data and if validation goes well then you can return true which will submit the form or you can return false if validation fails.

Scenario 3:  Set default button submission on ENTER key in asp.net form

In Asp.net Keying ENTER key will always submits the first button of your asp page, you may be having a scenario where you have around more than one button in your form with few text boxes. so here you don’t want to submit the first button always which is the default behavior. You can get the problem solved by declaring ‘defaultbutton’ in your form. Your form will have a property called ‘defaultbutton’ , so what ever the button needs to be submitted on enter key, the id of the button should be assigned here in the following way.

form id="form1" defaultbutton="yourbuttonid" runat="server"

The above property for form is available in asp.net 2.0 and later versions.

Scenario 4:  On Click function code is not executing when keying ENTER key

This is some strange behavior i have observed only when we have one text box & few buttons.  When we have only one text box in our form control, on keying ENTER key in this text box will submit the form but does not execute the onClick code.

One way of avoid this error is just add some hidden textbox, and then continue your job. This may not be a good solution, but this is one way of doing it.

The other way around is by Pre-setting __EVENTTARGET. Technically it’s good solution.

These are all the different scenario’s with Enter key, have you faced any other problem with ENTER key in asp.net form ? then add it yours in the comment box, we will try to figure out the solution for you.