jueves, 26 de enero de 2012

ASP.NET - Asignar Linkbutton como DefaultButton del Panel

LoginSi incluyes dentro de un panel un grupo de controles, entre ellos botones simples (Button), botones con imágen (ImageButton), tienes la opción de elegir cuál será el botón que se ejecute cuando presiones la tecla ENTER estando dentro del formulario.
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 Guiño

No hay comentarios.: