Esta funcionalidad es útil para formularios que incluyen cajas de texto y botones, donde el usuario luego de llenar el formulario simplemente quiere presionar la tecla ENTER en lugar de ir con el mouse hasta el botón que enviará la información.
Y cómo hacemos esto?
simple… en este ejemplo muestro un formulario de autenticación el cual está dentro de un control Panel, si el usuario estando dentro de una de las cajas de diálogo presiona la tecla ENTER, el formulario se enviará, como si se hubiera hecho click en el botón Login.
<asp:Panel ID="pnlLogin" DefaultButton="imgLogin" runat="server"> <table> <tr> <td> <asp:Label ID="Label3" runat="server" Text="Correo:"></asp:Label> <br /> <asp:TextBox ID="txtLogin" runat="server"></asp:TextBox> </td> <td> <asp:Label ID="Label4" runat="server" Text="Contraseña:"></asp:Label> <br /> <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox> </td> <td> <asp:ImageButton ID="imgLogin" runat="server" /> </td> </tr> </table> </asp:Panel>
Para que esto funcione simplemente le asignas a la propiedad DefaultButton el control que quieres que se ejecute… pero ojo este control a ejecutar sólo puede ser Button o ImageButton.
Lamentablemente, esta funcionalidad no está disponible para el control LinkButton, como dice este enlace de MSDN Panel DefaultButton Property
Pero, lo que podemos hacer es un truco, el cual consiste en incluir un LinkButton y un ImageButton, al imageButton le ponemos style=display: none para que sea invisible… pero esto no impedirá que igual se ejecute al presionar ENTER estando dentro del formulario. Veamos:
<asp:Panel ID="pnlLogin" DefaultButton="imgLogin" runat="server"> <table> <tr> <td> <asp:Label ID="Label3" runat="server" Text="Correo:"></asp:Label> <br /> <asp:TextBox ID="txtLogin" runat="server"></asp:TextBox> </td> <td> <asp:Label ID="Label4" runat="server" Text="Contraseña:"></asp:Label> <br /> <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox> </td> <td> <asp:LinkButton ID="lnkLogin" runat="server">Login</asp:LinkButton> <asp:ImageButton ID="imgLogin" style="display: none" runat="server" /> </td> </tr> </table> </asp:Panel>Te invito a que ejecutes el ejemplo.
Espero que les sea de utilidad
No hay comentarios.:
Publicar un comentario