Compartir a través de

Script de cliente en páginas web ASP.NET

  • Artículo

Actualización: noviembre 2007

Las aplicaciones web ASP.NET no se limitan a las herramientas y lenguajes basados en servidor. Puede incluir ECMAScript (JavaScript o JScript) en sus páginas web ASP.NET para crear una funcionalidad enriquecida para explorador. ASP.NET dispone de una amplia gama de características para admitir scripts de cliente.

Una opción es crear y agregar fragmentos de código individuales de scripts de cliente a las páginas web ASP.NET para admitir el comportamiento de explorador que diseñe para su aplicación. Esta opción resulta práctica si desea incluir sólo algunas partes pequeñas de código JavaScript o si está trabajando con un código JavaScript que ya tiene. Esta opción también permite que el tamaño de las páginas web ASP.NET sea el mínimo.

Otra opción consiste en aprovechar las eficaces características AJAX de ASP.NET. Las características AJAX incluyen un completo marco de trabajo que admite lo siguiente:

  • Programación orientada a objetos en JavaScript.

  • Devoluciones de datos asincrónicas.

  • Servicios web de aplicación para autenticación y perfiles.

  • Controles de servidor que administran los scripts de cliente con compatibilidad ampliada para depuración y seguimiento de traza.

Las características AJAX de ASP.NET le permitirán aprovechar la funcionalidad de JavaScript con menos codificación manual. Proporciona la funcionalidad ampliada de JavaScript y un marco de trabajo para crear la funcionalidad de cliente que se integra en ASP.NET.

En este tema se ofrece información general acerca de las opciones para agregar scripts de cliente a las páginas web ASP.NET. Contiene las siguientes secciones:

  • Escenarios

  • Incluir scripts de cliente personalizados en páginas ASP.NET

  • Ampliar JavaScript con características AJAX de ASP.NET

  • Controles de servidor ASP.NET que dependen de scripts de cliente

  • Agregar eventos de la secuencia de comandos de cliente a los controles de servidor ASP.NET

  • Hacer referencia a controles de servidor en scripts de cliente

  • Provocar eventos Click de cliente para los controles de servidor

  • Comunicación entre scripts de cliente y código de servidor

  • Crear componentes de script de cliente

  • Agregar funcionalidad de cliente a controles de servidor

Escenarios

Utilice los scripts de cliente cuando desee hacer lo siguiente:

  • Mejorar la experiencia del usuario con páginas web más enriquecidas, que son más receptivas a las acciones del usuario y presentan un comportamiento similar a las aplicaciones cliente tradicionales. Por ejemplo, puede utilizar el script de cliente para comprobar la entrada del teclado en un cuadro de texto a medida que se escriba cada carácter.

  • Agregar funcionalidad AJAX a las páginas web ASP.NET que le permitirá hacer lo siguiente:

    • Reducir las actualizaciones de página completa y evitar el parpadeo de la página mediante la manipulación dinámica de los elementos DOM de la página.

    • Actualizar y administrar la interfaz de usuario sin necesidad de una devolución de datos al servidor.

    • Organizar el código en componentes de cliente. Los componentes de cliente son objetos reutilizables que encapsulan JavaScript basado en Microsoft AJAX Library. Los componentes de cliente también se pueden administrar mediante controles de servidor personalizados o asociar a controles de servidor existentes para agregar funcionalidad de cliente.

Incluir scripts de cliente personalizados en páginas ASP.NET

Debido a que las páginas web ASP.NET simplemente representan marcado HTML, puede agregarles su propio script de cliente. Las páginas ASP.NET admiten secuencias de comandos de cliente en la medida en que el explorador que solicita la página admite dichas secuencias. Si la página se ejecuta en un explorador de un teléfono u otro dispositivo móvil, el grado de compatibilidad con la secuencia de comandos de cliente variará según el explorador.

Existen varias opciones para incluir scripts de cliente en páginas ASP.NET:

  • Puede incluir el script de cliente estáticamente en un bloque script que incluya código o que utilice un atributo include para hacer referencia a un archivo JavaScript (.js). Utilice esta opción para insertar bloques de scripts o archivos JavaScript que contengan scripts de cliente que no sea necesario crear dinámicamente y que no requieran la funcionalidad AJAX adicional que proporciona Microsoft AJAX Library.

  • Puede crear y agregar dinámicamente el script de cliente a la página web ASP.NET utilizando la clase ClientScriptManager. Utilice esta opción si desea crear scripts que dependen de información que sólo está disponible en tiempo de ejecución.

  • Si desea aprovechar las características AJAX de ASP.NET, puede administrar archivos de script de cliente mediante el control de servidor ScriptManager. El control de servidor ScriptManager también garantiza que Microsoft AJAX Library se carga en el explorador antes de que se ejecuten los scripts. Para obtener más información, vea Información general sobre AJAX en ASP.NET.

Incluir bloques de script de cliente estáticos

Se pueden agregar bloques script a una página ASP.NET del mismo modo que se haría con cualquier página HTML. También se pueden utilizar secuencias de comandos de cliente para escribir controladores de eventos para eventos de cliente como el evento onload de la página. Cuando una página ASP.NET se está ejecutando en el explorador, los elementos de marcado de la página son direccionables en el script de cliente. Provocan todos los eventos de cliente igual que en una página HTML.

Nota:

Puede hacer referencia a los controles de servidor ASP.NET en el script de cliente. Para obtener más información, vea Hacer referencia a controles de servidor en scripts de cliente, más adelante en este tema.

Una página web ASP.NET también puede tener acceso a un archivo de script haciendo referencia a él en el atributo src de una etiqueta <script>, como en el ejemplo siguiente:

<script type="text/javascript" src="MyScript.js"></script>

Mantener los scripts de cliente en archivos .js externos en lugar de mantenerlos en las páginas ayuda a organizarlos. También hace que sea más fácil administrar el control de versiones y compartirlos entre las páginas.

El explorador almacena en memoria caché los archivos .js externos, de forma similar a como se almacenan en memoria caché las páginas web y las imágenes. Una vez que el explorador carga el script como archivo externo, está disponible en la caché para cualquier página web que lo necesite. Esto puede ayudar a aumentar el rendimiento de la aplicación web.

Crear scripts de cliente dinámicamente

En muchos casos, la secuencia de comandos de cliente para la página se puede crear mediante declaración, normalmente como un bloque de secuencia de comandos. Sin embargo, se pueden crear los scripts de cliente dinámicamente. Esto resulta útil si el script depende de información que sólo está disponible en tiempo de ejecución. Por ejemplo, puede insertar el script de cliente en una página que direcciona un control de servidor cuyo nombre (identificador) no se conoce hasta que se ejecuta la aplicación, o puede crear un script que depende de los valores que recibe de un usuario.

Puede crear e insertar dinámicamente el script de cliente en una página representada llamando a los métodos de la clase ClientScriptManager, como se muestra a continuación:

En el ejemplo siguiente se muestra cómo agregar el script de cliente generado dinámicamente a la página. El código comprueba si una casilla denominada checkDisplayCount está activada. En caso afirmativo, el código realiza las tareas siguientes:

  • Crea una función de script de cliente que utiliza un elemento span para mostrar el recuento de caracteres en un control TextBox denominado TextBox1.

  • Agrega un evento de cliente al control TextBox.

  • Genera el elemento span.

El código supone que la página contiene una casilla denominada checkDisplayCount cuya propiedad AutoPostBack está establecida en true y un control PlaceHolder denominado PlaceHolder1.

Protected Sub Page_Load(ByVal sender As Object, _
        ByVal e As System.EventArgs)
    If checkDisplayCount.Checked Then
        Dim scriptText As String = ""
        scriptText &= "function DisplayCharCount(){"
        scriptText &= "   getElementByID("spanCounter").innerText = " & _
            "document.forms[0].TextBox1.value.length"
        scriptText &= "}"
        ClientScriptManager.RegisterClientScriptBlock(Me.GetType(), _
            "CounterScript", scriptText, True)
        TextBox1.Attributes.Add("onkeyup", "DisplayCharCount()")
        Dim spanLiteral As New LiteralControl()
        spanLiteral.Text = "<span id=""spanCounter""></span>"
        PlaceHolder1.Controls.Add(spanLiteral)
    End If
End Sub

void Page_Load(object sender, EventArgs e)
{
    if(checkDisplayCount.Checked)
    {
        String scriptText = "";
        scriptText += "function DisplayCharCount(){";
        scriptText += "   spanCounter.innerText = " + 
            " document.forms[0].TextBox1.value.length";
        scriptText += "}";
        ClientScriptManager.RegisterClientScriptBlock(this.GetType(), 
           "CounterScript", scriptText, true);
        TextBox1.Attributes.Add("onkeyup", "DisplayCharCount()");
        LiteralControl spanLiteral = new 
            LiteralControl("<span id=\"spanCounter\"></span>");
        PlaceHolder1.Controls.Add(spanLiteral);
    }
}

Para obtener más información, vea Cómo: Agregar secuencias de comandos de cliente a las páginas Web ASP.NET dinámicamente.

Para los métodos de la clase ClientScriptManager, se proporciona un tipo al que está asociado el bloque de script y se asigna una clave al bloque de script. Cuando se proporciona un tipo resulta más fácil evitar colisiones si tanto la página como los controles (controles personalizados o controles de usuario) agregan bloques de script a la misma página. El uso de una clave permite evitar la duplicación. Si llama a uno de los métodos para agregar el script y ya existe un script con la misma clave y el mismo tipo, el script no se vuelve a agregar.

El tipo y la clave proporcionados permiten evitar una duplicación innecesaria. Por consiguiente, no suele ser necesario determinar explícitamente si un bloque de script ya existe. Sin embargo, si es útil en la aplicación comprobar si ya existe un bloque de secuencia de comandos, puede llamar a los métodos siguientes:

Agregar un script de cliente mediante el control ScriptManager

Si está utilizando las características AJAX de ASP.NET, el control ScriptManager permite agregar archivos de script a una página. Esto incluye los archivos de script estáticos (archivos .js) del disco y los archivos de script que se incrustan como recursos en un ensamblado. Puede especificar los archivos de script en el control mediante declaración. O bien, puede utilizar los métodos de registro del control ScriptManager que permiten administrar los archivos de script de cliente existentes mediante programación y trabajar con scripts para admitir la actualización parcial de la página.

Para obtener información general acerca del control ScriptManager, vea Información general sobre el control ScriptManager. Para obtener información sobre cómo incrustar un archivo JavaScript como un recurso en un ensamblado y cómo utilizarlo en una página web, vea Tutorial: Incrustar un archivo JavaScript como recurso en un ensamblado.

Nota:

Si está utilizando las características AJAX de cliente de ASP.NET pero no las características de servidor, utilice los métodos de la clase ClientScriptManager para insertar scripts en una página web ASP.NET. Por ejemplo, si no está utilizando el control UpdatePanel ni las características de localización de scripts, no necesita el control ScriptManager. Por consiguiente, no puede llamar a sus métodos para insertar el script de cliente en la página. Utilizar los métodos de la clase ClientScriptManager suele ser más eficaz que utilizar los métodos del control ScriptManager. Esto es debido a que los métodos de clase ClientScriptManager no requieren el procesamiento adicional de las características de servidor admitidas por el control ScriptManager. Si tiene que crear el script dinámicamente (en lugar de simplemente administrar el script existente), utilice la clase ClientScriptManager para insertar el script de cliente en una página. Por ejemplo, utilice la clase ClientScriptManager si desea crear el script de cliente mediante programación en función de una información a la que un archivo de script ya existente no puede hacer referencia.

Ampliar JavaScript con características AJAX de ASP.NET

ASP.NET admite la funcionalidad AJAX, que permite utilizar scripts de cliente para agregar características enriquecidas a una página web ASP.NET. Incluye devoluciones de datos asincrónicas y una interfaz de usuario muy receptiva, entre otras. La funcionalidad AJAX se implementa mediante Microsoft AJAX Library, que está compuesto por bibliotecas de scripts de cliente que incorporan tecnologías ECMAScript (JavaScript) y HTML dinámico (DHTML) aptas para diferentes exploradores. La funcionalidad AJAX se integra en la plataforma de desarrollo para servidor ASP.NET.

Puede utilizar el sistema de tipos Microsoft AJAX Library, características orientadas a objetos y extensiones de objetos JavaScript para ofrecer las características siguientes para la creación de scripts de cliente personalizados:

  • Espacios de nombres

  • Herencia

  • Interfaces

  • Enumeraciones

  • Reflexión

  • Aplicaciones auxiliares de depuración

  • Seguimiento

  • Control de excepciones con tipo

  • Métodos auxiliares para cadenas y matrices.

    Nota:

    Puede utilizar Microsoft AJAX Library aunque no tenga previsto utilizar las características AJAX para servidor ASP.NET.

Para obtener más información acerca de cómo Microsoft AJAX Library amplía JavaScript, consulte los siguientes temas:

Compatibilidad para exploradores de las características AJAX

La capa de compatibilidad para exploradores de Microsoft AJAX Library proporciona compatibilidad para scripting de AJAX para los exploradores que se usan con más frecuencia (incluidos Microsoft Internet Explorer, Mozilla Firefox y Apple Safari). Esto permite escribir el mismo script independientemente del explorador compatible al que esté destinado. Para obtener más información, vea Información general sobre AJAX en ASP.NET.

Controles de servidor ASP.NET que dependen de scripts de cliente

La funcionalidad de algunos controles de servidor ASP.NET depende de secuencias de comandos de cliente. Por ejemplo, el control LinkButton requiere secuencias de comandos para implementar su comportamiento de devolución de datos. Las secuencias de comandos de cliente requeridas para los controles de servidor Web ASP.NET se agregan automáticamente a la página cuando ésta se representa. Las secuencias de comandos generadas para estos controles son independientes de las secuencias de comandos creadas por el desarrollador.

Para obtener más información, vea Controles de servidor web ASP.NET que utilizan script de cliente.

Agregar eventos de la secuencia de comandos de cliente a los controles de servidor ASP.NET

Los controles ASP.NET se representan como elementos en la página. (Los elementos exactos representados por un control dependen del lenguaje de marcado de la página, que podría ser HTML, XHTML u otro lenguaje.) Por lo tanto, puede agregar el control de eventos de la secuencia de comandos de cliente a los controles del mismo modo que lo haría con cualquier elemento de la página. En algunos casos, sin embargo, debe saber cómo representa el control su resultado y qué atributos se reserva para sí mismo.

Para obtener más información, vea Cómo: Agregar eventos de secuencias de comandos de cliente a los controles de servidor Web ASP.NET

Agregar controladores de eventos de cliente mediante declaración

En el formato de los controles de servidor ASP.NET, los valores de las propiedades se establecen mediante atributos. Por ejemplo, para establecer la propiedad Text de un control TextBox, puede crear un marcado como el siguiente:

<asp:textbox id="TextBox1"  text="Sample Text" />
Nota de seguridad:

TextBox acepta los datos proporcionados por el usuario, lo que puede suponer una amenaza para la seguridad. De forma predeterminada, las páginas Web ASP.NET validan los datos escritos por el usuario para comprobar que no incluyen secuencias de comandos ni elementos HTML. Para obtener más información, vea Información general sobre los ataques mediante secuencias de comandos.

Si incluye un atributo que no está asignado a ninguna propiedad del control, ASP.NET omite el atributo durante el procesamiento del servidor. Lo pasa al explorador tal cual, como parte del marcado generado por el control. Por ejemplo, el control TextBox no tiene ninguna propiedad denominada onkeyup. Por consiguiente, si incluye un atributo onkeyup en el marcado de un control TextBox, el atributo se pasa a través del explorador. Este comportamiento permite agregar enlaces de eventos a los controles de servidor declarándolos en el marcado. Por ejemplo, el formato siguiente de un control TextBox hace que el cuadro de texto muestre la longitud del texto actual en un elemento span denominado spanCounter cada vez que el usuario presiona una tecla en el cuadro de texto:

<asp:textbox id="TextBox1"  text="Sample Text" 
  onkeyup="spanCounter.innerText=this.value.length;" />

Opcionalmente, el evento podría llamar a un método definido en un script de cliente situado en otra parte de la página:

<asp:textbox id="TextBox1"  text="Sample Text" 
  onkeyup="DisplayCount(this);" />

Recuerde que el lenguaje empleado para el código de servidor (Visual Basic o C#) no afecta al script de cliente, que siempre se escribe en ECMAScript (JavaScript o JScript).

Para obtener más información, vea Cómo: Agregar eventos de secuencias de comandos de cliente a los controles de servidor Web ASP.NET.

Agregar atributos en el código de servidor

Además de agregar atributos de paso a través a un control mediante declaración, también se pueden agregar atributos mediante programación utilizando código de servidor. Esto resulta útil si el valor del atributo que se va a agregar se conoce sólo en tiempo de ejecución. Para obtener información detallada, vea Cómo: Establecer atributos HTML de controles en páginas Web ASP.NET.

Hacer referencia a controles de servidor en scripts de cliente

Cuando se representa un control de servidor ASP.NET, la propiedad ClientID del control se representa en la página como los atributos id y name del elemento resultante. (La propiedad ClientID se genera automáticamente a partir de la propiedad ID que se establezca.) Por ejemplo, podría crear el control de servidor ASP.NET siguiente:

<asp:textbox id="TextBox1"  text="Sample Text" />

La propiedad ClientID se establece en TextBox1 y el elemento resultante tendría la apariencia siguiente en un explorador basado en HTML:

<input name="TextBox1" type="text" value="Sample Text" id="TextBox1" />
Nota:

El elemento form sólo representa un atributo ID, no un atributo name.

Por consiguiente, puede hacer referencia al control de servidor en el script de cliente mediante estos atributos. Normalmente, el control se direcciona utilizando una referencia completa en el script de cliente. Si el control es un elemento secundario del elemento form de la página, normalmente se hace referencia a él en el script de cliente mediante una sintaxis como se muestra en el siguiente ejemplo:

var tb1 = document.getElementById("TextBox1");
tb1.value = "New value";

En el ejemplo siguiente se supone que, para el elemento form de la página, el atributo id se ha establecido en form1.

document.form1.TextBox1.value = "New value";

La sintaxis exacta necesaria para hacer referencia a un control de servidor depende del control que se esté utilizando y de si es un elemento secundario de otro control. Si no está seguro de cómo hacer referencia a un control, puede ser útil ejecutar la página, ver su código y determinar cómo se ha representado el control.

Hacer referencia a controles representados en otros controles

Algunos controles representan controles secundarios en la página. Entre ellos se encuentran los controles de lista de datos, como ListView, GridView, DetailsView, FormView, DataList y Repeater, controles de usuario y controles de elementos web.

En estos casos, es posible que los controles secundarios no tengan identificadores únicos. Esto se puede deber a que los controles secundarios se definen en una plantilla que genera las nuevas instancias del control para cada fila de datos (controles de lista de datos). O porque el control primario se puede agregar a la página desde un origen externo (controles de usuario y controles de elementos web). Por consiguiente, estos controles primarios son contenedores de nomenclatura (implementan INamingContainer). Un contenedor de nombres garantiza que sus controles secundarios tengan identificadores únicos en la página.

Por ejemplo, podría crear una propiedad ItemTemplate en el control DataList. En la plantilla, podría agregar un control CheckBox cuyo identificador se establece en checkEnabled. Cuando se representa el control DataList, se representa un nuevo control checkEnabled para cada elemento de datos. La página representada no debe contener varias instancias de un elemento denominado checkEnabled. Por consiguiente, el control DataList crea una identidad única para cada uno de sus controles secundarios.

Las identidades únicas para los controles secundarios de un contenedor de nombres se generan al representar dos propiedades. Para cada control secundario:

  • La propiedad UniqueID del control se representa como atributo name.

  • La propiedad ClientID del control se representa como atributo id.

Ambas propiedades, ClientID y UniqueID, están basadas en la propiedad ID original, corregida con suficiente información para garantizar que el resultado sea único en la página. Se puede hacer referencia al valor de ClientID (el atributo id del elemento representado) en el script de cliente.

Si se muestra una página que contiene un contenedor de nomenclatura en el explorador, puede examinar el código fuente de la página para ver los identificadores únicos generados como atributos name e id para los controles secundarios del contenedor de nomenclatura. Sin embargo, se recomienda no confiar en las referencias directas a los identificadores tal como se ven en el explorador. La fórmula utilizada para generar los identificadores únicos de los controles secundarios puede cambiar. En lugar de ello, obtenga el valor de la propiedad ClientID del control secundario en el código de servidor y utilice este valor para hacer referencia a dicho control. Por ejemplo, podría crear dinámicamente una secuencia de comandos de cliente en la página. Si el script de cliente hace referencia a un control secundario, obtenga la propiedad ClientID del control secundario y genérela en el script dinámico.

Provocar eventos Click de cliente para los controles de servidor

Tal como se ha explicado anteriormente, puede agregar eventos Click de cliente a la mayoría de los controles de servidor ASP.NET si agrega el atributo onclick al marcado del control. Sin embargo, algunos controles reservan el atributo onclick para definir el enlace al evento de servidor. Entre estos se encuentran los controles Button, LinkButton e ImageButton. Estos controles no permiten utilizar el atributo onclick mediante declaración para agregar un controlador de secuencia de comandos de cliente al control.

El controlador de secuencia de comandos de cliente para el evento Click se puede agregar de dos maneras:

  • Establezca la propiedad OnClientClick del control como la secuencia de comandos que se debe ejecutar. Cuando se representa el control de botón, el valor de OnClientClick se convierte en un atributo onclick.

  • Agregue el atributo onclick mediante programación llamando al método Add de la colección Attributes del control.

    Nota:

    No puede agregar un atributo onclick mediante programación a un control de servidor si éste ya utiliza onclick como parte de su funcionalidad básica, como LinkButton.

En el ejemplo de código siguiente se muestra un control Button que produce eventos Click en el cliente y en el servidor:

<asp:button id="Button1" 
   
  OnClientClick="return confirm('Ok to post?')" 
  onclick="Button1_Click" 
  Text="Click!" />

Comunicación entre scripts de cliente y código de servidor

Además de utilizar las devoluciones de datos estándar, las páginas web ASP.NET pueden comunicarse con el script de cliente y con el código de servidor de varias maneras. Las características AJAX de ASP.NET como el control de servidor UpdatePanel automatizan las actualizaciones asincrónicas parciales de la página. Además, AJAX de ASP.NET permite llamar a los servicios web de forma asincrónica.

Si no utiliza las características AJAX de ASP.NET, puede invocar una devolución de llamada de cliente personalizada directamente y compartir la información entre el explorador y el servidor utilizando diferentes métodos. En la sección siguiente se proporciona información sobre las opciones disponibles.

Llamar al código de servidor directamente desde el script de cliente

El script de cliente puede llamar directamente al código de servidor si se implementan devoluciones de llamada de cliente. En una secuencia normal de páginas web ASP.NET, cada acción del usuario que ejecuta código de servidor requiere una devolución de datos. Sin embargo, también puede invocar el procesamiento del servidor desde el explorador sin una devolución de datos completa. En este caso, el explorador no envía la página entera al servidor y vuelve a cargarla cuando el servidor responde. En su lugar, el explorador envía una cantidad pequeña de datos al servidor. Cuando el servidor envía una respuesta, el script de cliente en el explorador procesa los datos devueltos sin volver a cargar la página. Durante el procesamiento del servidor, se mantiene todo el estado del cliente, como las variables locales. Este proceso se conoce como devolución de datos asincrónica y es clave para la representación parcial de la página.

Puede llamar a los métodos de servidor desde el script de cliente sin una devolución de datos de las siguientes maneras:

  • Utilice el control de servidor ASP.NET UpdatePanel. Este control forma parte de la funcionalidad AJAX de ASP.NET. Permite definir una región de una página que se actualizará con una actualización parcial de la página. Cuando utilice el control UpdatePanel, no es necesario que escriba ningún script de cliente para invocar las actualizaciones asincrónicas parciales de la página. Para obtener más información, vea Información general sobre la representación parcial de páginas y Información general sobre el control UpdatePanel.

  • Utilice la compatibilidad de AJAX de ASP.NET para la comunicación de servicios web para escribir scripts de cliente que invoquen un método de servidor web. Este enfoque es conceptualmente similar a escribir su propia devolución de llamada del script de cliente para llamar a un método de servidor web. Sin embargo, Microsoft AJAX Library administra los detalles de la invocación del método de servidor y proporciona una biblioteca de scripts de cliente más sólida para realizar y procesar la llamada. Para obtener más información, vea Servicios web de AJAX en ASP.NET.

  • Implementar una devolución de llamada de cliente. En este caso, se escribe el código de cliente que envía la solicitud y procesa el resultado. El enfoque más común es crear una función de llamada en el script de cliente y una función de devolución de llamada que se invoca cuando el servidor devuelve los resultados. Para obtener más información, vea Implementar mediante programación devoluciones de llamada de cliente sin devoluciones de datos en páginas web de ASP.NET

Cada enfoque tiene sus ventajas. Crear una devolución de llamada de cliente propia suele ofrecer menos sobrecarga y un tamaño de página más pequeño. Utilizar el control de servidor UpdatePanel permite implementar actualizaciones parciales de la página sin necesidad de escribir ningún script de cliente. Utilizar AJAX para llamar a los servicios web también elimina la mayoría de los scripts de cliente que tendría que escribir para realizar las llamadas asincrónicas a los servicios web.

Compartir datos mediante un control HiddenField

Puede compartir información entre el script de cliente y el código de servidor agregando un control HiddenField a la página. Puede hacer referencia al campo oculto en el script de cliente mediante su identificador. También puede hacer referencia al campo oculto en el código de servidor. Esto permite almacenar los valores en cualquiera de los bloques de código y leerlos en el otro. Para pasar información del código de servidor al script de cliente, puede crear un campo oculto mediante programación con el método RegisterHiddenField. Este método permite especificar un identificador y un valor para el campo. Puede utilizar el campo para almacenar valores dinámicos en la página de manera que ese script de cliente pueda leerlos.

Compartir datos mediante cookies

También puede compartir valores entre el código de servidor y el código de cliente mediante cookies. Para obtener más información sobre cómo escribir y leer cookies en el código de servidor, vea Cómo: Escribir una cookie y Cómo: Leer una cookie. Para obtener información detallada sobre cómo usar JavaScript para leer y escribir cookies, vea JavaScript and cookies en el sitio web de MSDN.

Compartir datos durante devoluciones de datos asincrónicas

Si está utilizando las características AJAX de ASP.NET, puede enviar datos personalizados como una cadena desde el servidor al cliente durante las devoluciones de datos asincrónicas (representación parcial de la página) utilizando el método RegisterDataItem. El método RegisterDataItem permite utilizar el código de servidor para registrar un campo asociado a un control. Puede obtener acceso al valor del campo del script de cliente en el explorador a través de los objetos AJAX de ASP.NET Sys.WebForms.PageLoadingEventArgs, Sys.WebForms.PageLoadedEventArgs y Sys.WebForms.PageLoadedEventArgs. Sólo se puede llamar al método RegisterDataItem durante una devolución de datos asincrónica.

Para obtener información sobre cómo utilizar el método RegisterDataItem para compartir datos entre el servidor y el cliente, consulte los temas siguientes:

Crear componentes de script de cliente

Los componentes de cliente son objetos reutilizables que encapsulan JavaScript basado en Microsoft AJAX Library. La biblioteca proporciona las siguientes clases de tipos de objetos de cliente: Component (clase base para componentes no visuales), Control y Behavior. Puede derivar de estas clases para proporcionar una funcionalidad de cliente enriquecida, que incluye lo siguiente:

  • Obtener acceso al ciclo de vida de un componente desde la inicialización a la eliminación. Se incluyen los eventos que se provocan cuando cambian los valores de la propiedad.

  • Representar un elemento DOM como un objeto de cliente que tiene la nueva funcionalidad. De esta manera se amplía el comportamiento de los elementos DOM. Por ejemplo, puede agregar un comportamiento de impresión de marcas de agua que se puede asociar a un cuadro de texto existente.

Para obtener más información, vea los temas siguientes:

Agregar funcionalidad de cliente a controles de servidor

Cualquier control de servidor ASP.NET existente o personalizado se puede convertir en un control extensor AJAX de ASP.NET. Un control extensor es un control de servidor web que utiliza las funciones de ECMAScript (JavaScript), DHTML y AJAX del explorador web para agregar características como interactividad y comunicación asincrónica con el servidor.

Para obtener más información, vea los temas siguientes:

Vea también

Conceptos

Controles de servidor Web ASP.NET y funciones del explorador

Modelo de eventos de control de servidor Web ASP.NET