Cómo lanzar un método del servidor desde el cliente con Telerik + Javascript + ASP.NET

Seguramente que alguna vez habéis tenido la necesidad de lanzar un método de la parte del servidor cuando se produce un evento en una parte del cliente.

Caso concreto: llamar a un método del servidor cuando pulsamos intro.

Voy a exponer el caso concreto en el que nos encontramos para contextualizar: tenemos un cliente que necesita que cuando en una caja de texto multilínea se pulse intro, se genere una caja de texto nueva, en lugar de añadirse un retorno de línea en dicha caja.

¿Cómo lo resolvemos?

Vamos a sustituir la caja de texto ASP.NET normal por una de Telerik:

<telerik:RadTextBox ID="txtPruebas" runat="server" TextMode="MultiLine"
    Width="500px" Height="150px">
    <ClientEvents OnKeyPress="Intro" />
</telerik:RadTextBox>
<asp:Button ID="cmdBotonKeyUp" runat="server" Visible="true" style="display:none;"
    Text="cmdBotonKeyUp" OnClick="cmdBotonKeyUp_Click" />

Y como podéis ver en la declaración, vamos a programar el evento del cliente Intro con un método de Javascript:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function Intro(sender, eventArgs)
        {
            var c = eventArgs.get_keyCode();
            if (c == 13)
            {
                var clickButton = document.getElementById("<%= cmdBotonKeyUp.ClientID %>");
                clickButton.click();
            }
        }
    </script>
</telerik:RadCodeBlock>

Lo que realiza el sistema es que cuando se pulsa la tecla intro sobre el RadTextBox, se ejecuta el evento OnKeyPress y mediante la función Javascript Intro comprobamos si se ha pulsado la tecla intro (código 13). Si es así, pulsamos el botón cmdBotonKeyUp que además ya hemos ocultado vía CSS. Y ese botón ejecuta el código que os dejo a continuación:

protected void cmdBotonKeyUp_Click(object sender, EventArgs e)
{
    txtPruebas.Text += Environment.NewLine + "Intro pulsado.";
}
Quizá te interese...
Deja un comentario...
Suscribirme
Notificación de
guest
0 Comentarios
Comentarios en línea
Ver todos los comentarios