ASP.NET AJAX – (II) Creando nuestro primer proyecto

Written by: on 27/02/2007 @ 09:40

Nada mas sencillo que crear un proyecto basico en AJAX ASP.NET, una vez preparado el entorno como vimos en el capitulo anterior, y dado que disponemos de una plantilla para ello no nos complicaremos la vida para empezar:

Nuevo Proyecto

 

Esto nos creara una estructura de la siguiente manera:

Estructura

Nada del otro mundo, no?? un Default, un web.config y la DLL para usar los sencillos AjaxControlToolkit. Ya que hemos usado la plantilla, vamos a entrar un poco mas a fondo para ver que nos ha creado nuevo respesto a un proyecto ASP.NET nornal

 DEFAULT.ASPX

 

Como vemos no tenemos nada especial que destacar a excepcion del ScriptManager, el cual podriamos decir que es el corazon de AJAX ASP.NET, sera el que se encargue de manejar nuestros componentes, por lo tanto siempre tendremos que tener uno en nuestra pagina.
<%@PageLanguage=»C#»AutoEventWireup=»true»CodeFile=»Default.aspx.cs»Inherits=»_Default» %>
<!DOCTYPEhtmlPUBLIC«-//W3C//DTD XHTML 1.1//EN»«http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd»>
<htmlxmlns=»http://www.w3.org/1999/xhtml»>
<headrunat=»server»>
<title>Untitled Page</title>
</head>
<body>
<formid=»form1″runat=»server»>
<asp:ScriptManagerID=»ScriptManager1″runat=»server»/>
<div>
</div>
</form>
</body>
</html>

Como dijemos en la charla del otro dia, repitamos todos, ScriptManager es nuestro Dihos, oh!! que no se nos olvide nuestro ScriptManager !! Aqui en su vista de diseño:

ScriptManager

Con el que si tenemos verdaderos cambios es con el web.config, el cual se nos ha configurado para poder trabajar con AJAX.

Tambien vemos que en la barra de herramientas tenemos una seccion nueva:

Herramientas

Pues para nuestra primera aplicacion simplemente arrastraremos el componente UpdatePanel y un Timer a la pagina, y dentro de el meteremos un label, y en el Timer le cambiamos el parametro Interval  por 1000 y definir un evento Tick, a nivel de codigo nos quedaria algo asi:


<formid=»form1″runat=»server»>
    <asp:ScriptManagerID=»ScriptManager1″runat=»server»/>
    <asp:TimerID=»Timer1″runat=»server»Interval=»1000″ OnTick=»dameHora» >
    </asp:Timer>
    <div>
        Son las
        <asp:UpdatePanelID=»UpdatePanel1″runat=»server»>
            <ContentTemplate>
                <asp:LabelID=»lblHora»runat=»server»></asp:Label>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</form>

Ahora solo tenemos que decirle que va ha hacer cuando salte el Timer


protectedvoid dameHora(object sender, EventArgs e)
{
lblHora.Text = DateTime.Now.ToLongTimeString();
}

LISTO !! Ya hemos creado nuestra primera aplicacion que solita cambia nos va diciendo la hora en cada momento.Si, si, lo se, eso lo haciamos un un cutre script hace años, no desespereis que esto es solo el primer paso, imaginaos que lo que hace es recoger unas rss o datos de un webservice, o ……

 

Catogories: .NET, Ajax

Leave a Reply

Subscribe via RSS