Los UpdatePanels son extensiones de AJAX que sirven para realizar operaciones asyncronicamente, es decir que no se neceista hacer un postback de la pagina para realizar alguna funcion.
Hace poco desarrollé una aplicacion de chat en asp.net con C# y necesitaba que los mensajes conforme iban siendo enviados se mostraran en la pantalla, pero no me podia dar el lujo de estar haciendo postback para esto, entonces decidi usar UpdatePanels y me puse a investigar en internet como usarlos, pero todo lo que encontraba parecia escrito en otro idioma. Al final logré entenderlos y ahora se los voy a explicar de forma sencilla.
Los UpdatePanels se conforman de 2 partes principales: ContentTemplate y Triggers. Los ContentTemplate es donde van todos los controles que no queremos que hagan postback. Y los Triggers son los controles que queremos que disparen los eventos.
Veamos el codigo .aspx:
Primero que todo necesitamos un ScriptManager:
<asp:ScriptManager ID=”script” runat=”server” EnablePartialRendering=”true”>
</asp:ScriptManager>
Es importante que pongamos el EnablePartialRengering en true.
Agregaremos un boton :
<asp:Button ID=”btn” runat=”server” Text=”Actualizar Adentro” />
Luego agregamos el UpdatePanel:
<asp:UpdatePanel ID=”up” runat=”server” UpdateMode=”Conditional”>
Aquí debemos ponel el UpdateMode en Conditional.
Ahora creamos el ContentTemplate y ponemos los controles que queremos (en este caso pondre solamente un label):
<ContentTemplate>
<fieldset>
<asp:Label ID=”lbl” runat=”server” Text=”Label”></asp:Label>
</fieldset>
</ContentTemplate>
Luego de los controles tenemos que agregar los Triggers (en este caso pondré al boton que agrgamos al principio como un trigger):
<Triggers>
<asp:AsyncPostBackTrigger ControlID=”btn” EventName=”Click” />
</Triggers>
Al ser un botón, el evento que queremos capturar es el click.
Por últimos cerramos el UpdatePanel:
</asp:UpdatePanel>
Para este ejemplo agregaremos dos controles mas, un Label y otro Botón (afuera del UpdatePanel):
<asp:Label ID=”lbl2” runat=”server” Text=”Label”></asp:Label><br />
<asp:Button ID=”btn2” runat=”server” Text=”Actualizar Ambos” />
Ahora veamos el codebehind (.cs):
Lo que queremos hacer en este ejemplo es que al cargarse la página los labels muestren la hora en que fueron cargados, para esto agregamos el siguiente codigo en el Page_Load:
protected void Page_Load(object sender, EventArgs e)
{
lbl.Text = “adentro: ” + DateTime.Now.ToLongTimeString();
lbl2.Text = “afuera: ” + DateTime.Now.ToLongTimeString();
}
Al cargar la página por primera vez los dos labels deberían mostrar la misma hora, pero al hacer click en el botón que dice Actualizar Adentro debería cambiar solamente la hora del Label que pusismos en el UpdatePanel, ya que este boton lo tenemos como un trigger del UpdatePanel. Y al hacer click en el botón que dice Actualizar Ambos los dos deberian tomar nuevamente la hora actual, ya que este boton genera un postback completo de la página.
Espero que esta información les sea útil y si no entienden algo, estoy a sus ordenes para resolver cualquier duda.
Codigo: Aqui
