Setting The Enter Key To Correspond To Different Buttons On The Same Page

There are times when the enter key can refer to different actions depending on where we are within the page. Asp.Net provides a very easy way to assign the enter key to seperate sections of a page using the Panel Control.

One of the properties of the Panel control is the DefaultButton property where you set the ID of a button that will corressopond to any Enter key presses by the user within that Panel.

Panel1 shown below has been hooked up to Button1 and Panel2 to Button2. If the user was within Panel1 and they hit the Enter key then Button1's click event would be handled. Likewise if the user was within Panel2 then Button2's click event would be handled. The code for the Panels would look like:

<asp:Panel ID="Panel1" runat="server" DefaultButton="Button1">

<asp:Panel ID="Panel2" runat="server" DefaultButton="Button2">

To further enhance the page and to remove any confusion we would ideally only allow the Enter key to be used if the user was within a Panel. We can do this by setting the UseSubmitBehavior="false" for both button controls.