asp.netkeypressmodalpopupextender

Why does `Enter` key launch modal in Asp.Net


I have a Login page in my Asp.Net app. I've noticed that when I hit the Enter key in the username or password textboxes, that it launches a modal coming from my Site.Master page. I have tried a few solutions, including adding a default button to my modal's Panel as well as trying to apply UseSubmitBehavior=false to my asp:LinkButton that launches the modal. This last approach fails because there is no UseSubmitBehavior for an asp:LinkButton. Why does this occur and how can I resolve it?

Master.Site

  <asp:button id="hiddenButton" runat="server" style="display:none;" />
  <ajaxToolkit:ModalPopupExtender ID="uxReportModal" runat="server" PopupControlID="ReportPanel" TargetControlID="hiddenButton" CancelControlID="btnClose" BackgroundCssClass="modalBackground"> </ajaxToolkit:ModalPopupExtender>
  <asp:Panel ID="ReportPanel" runat="server" CssClass="modalPopupReport" align="center" style="display:none; text-align: left;" DefaultButton="hiddenButton">
  ....
     <div style="text-align:center; margin-bottom: 20px;">
        <asp:Button ID="btnSubmit" runat="server" Text="Submit" onClick="btnSubmit_Click"/>
        <asp:Button ID="btnClose" runat="server" Text="Close" />
     </div>               
  </asp:Panel>

Note: I've also tried adding a javascript solution, but that doesn't work either. Basically it fails because the textbox id isn't defined and I'm not sure how to properly apply the solution from the example:

LoginPage.aspx

<script>
    uxTextBoxUserName.Attributes.Add("onkeydown", "if(event.which || event.keyCode){if ((event.which == 13) || (event.keyCode == 13)) {document.getElementById('"+Button1.UniqueID+"').click();return false;}} else {return true}; ");
</script>
....
<td class="style2">
  <asp:TextBox ID="uxTextBoxUserName" runat="server" Height="18px" Width="150px"></asp:TextBox>
</td>

Solution

  • I was able to resolve this using the "hiddenButton" that is above my modal Panel. This seems to be some sort of default submit behavior coming from the LinkButton. I had to set `DefaultButton="hiddenButton"' in my Form wrapper, not Panel.

    <form runat="server" defaultbutton="hiddenButton">
    

    Then, I disabled the "hiddenButton". I don't understand why there is no built in method to disable this behavior in the asp controls, but this hack works.

     <asp:button id="hiddenButton" runat="server" type="button" Enabled="false" style="display:none;" />