Set a default button for the Enter Key that is triggered on Enter-key press


Set the default button that is triggered when the user hits the enter key: 
Here, I will cover how to use the DefaultButton attribute on the single form and on multiple forms(Panels).
-----------------------
Problem :
-----------------------
"Enter" Key is handled in a little tricky way in ASP.NET-
 (1)If there is a single Textbox and single button, then it becomes straight forward, the button is submitted.
    However, note that the buttonclick event code doesnt get executed, though the page postsbacks.
 (2)If there are two or more, buttons, then it takes up the first button as the default button.
    However, it still doesnt execute the event handler but just refreshes the page.
---------------------------
Probable SOlution(tricky):
---------------------------
Do you write some javascript code to ensure that when the user hit the enter key, the appropriate button on the form triggers a "click" event on the server-side? 
---------------------------
ASP.NET Solution: Single Form
---------------------------
Fortunately, ASP.NET 2.0 introduces a wonderful work around for this.
You can now use the HtmlForm control's DefaultButton property to set which button should be clicked when the user hits enter. This will force the application to use that submit button if the user chooses to press enter instead of clicking the actual button.

<form id="myform" DefaultButton="bnt_Submit" runat="server">
  ...
</form>
---------------------------
ASP.NET Solution: Multiple Forms
---------------------------
The defaultbutton property can be specified at the panel level in the <asp:panel> definition tag.
The form level default button settings are overridden when specified at the panel level, for those controls that are inside the panel.
The below code contains a form and 2 panels with each of them containing their respective buttons.
You can see that each panel has a default button specified which would trigger the corresponding button's event handler when "Enter" Key is pressed.

<form id="form1" runat="server" defaultbutton="FormButton">
 <asp:TextBox ID="txt" runat="server"></asp:TextBox>
 <!-- Form's default button for above textbox -->
 <asp:Button ID="FormButton" runat="server" Text="Cancel" OnClick="FormButton_Click" />
 
 <asp:Panel ID="Panel1" runat="server" defaultbutton="Button1">
  <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
  <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
  <!-- Here Panel's default button overriding the Form's default button -->
  <asp:Button ID="Button1" runat="server" Text="Button1" OnClick="Button1_Click" />
 </asp:Panel>
 <asp:Panel ID="Panel2" runat="server" defaultbutton="Button2">
  <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
  <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
  <!-- Here Panel's default button overriding the Form's default button -->
  <asp:Button ID="Button2" runat="server" Text="Button2" OnClick="Button2_Click" />
 </asp:Panel>
</form>

 
Ebook Download
View all
Learn
View all