Introduccion a ASP .NET 2.0

59
Práctica 2 Práctica 2 Introducción a ASP .NET 2.0 Introducción a ASP .NET 2.0 Universidad de Oviedo Universidad de Oviedo Comercio Electrónico Comercio Electrónico

Transcript of Introduccion a ASP .NET 2.0

Page 1: Introduccion a ASP .NET 2.0

Práctica 2Práctica 2Introducción a ASP .NET 2.0Introducción a ASP .NET 2.0

Práctica 2Práctica 2Introducción a ASP .NET 2.0Introducción a ASP .NET 2.0

Universidad de OviedoUniversidad de Oviedo

Comercio ElectrónicoComercio Electrónico

Page 2: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 22

Páginas estáticasPáginas estáticasPáginas estáticasPáginas estáticas Al principio, el Web estaba poblado únicamente por páginas Al principio, el Web estaba poblado únicamente por páginas

estáticasestáticasEl servidor Web simplemente localizaba el documento solicitado en el URL y se lo entregaba al cliente

Este enfoque puede ser perfectamente válido para muchos Este enfoque puede ser perfectamente válido para muchos sitiossitios

Siempre y cuando no requieran actualizaciones continuas, ya que hay que eso implica o bien modificar, a mano, las páginas existentes, o bien crear una nueva

Pero no permitiría, por ejemplo, crear un sitio de comercio Pero no permitiría, por ejemplo, crear un sitio de comercio electrónico donde se pueda comprar, o el de un bancoelectrónico donde se pueda comprar, o el de un banco

Es necesario acceder a datos en el servidor y crear una página a petición

Page 3: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 33

Funcionamiento de las Funcionamiento de las páginas estáticaspáginas estáticasFuncionamiento de las Funcionamiento de las páginas estáticaspáginas estáticas

Page 4: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 44

Funcionamiento de las Funcionamiento de las páginas dinámicaspáginas dinámicasFuncionamiento de las Funcionamiento de las páginas dinámicaspáginas dinámicas

Page 5: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 55

Modo de funcionamientoModo de funcionamientoModo de funcionamientoModo de funcionamiento El esquema de funcionamiento de las páginas El esquema de funcionamiento de las páginas

dinámicas es siempre similar independientemente de dinámicas es siempre similar independientemente de en qué se hayan desarrollado éstasen qué se hayan desarrollado éstas

CGI, ASP, Servlets/JSP… El servidor Web detecta una petición de una página El servidor Web detecta una petición de una página

dinámica y se la pasa al programa necesariodinámica y se la pasa al programa necesarioPodría ser una extensión del servidorO bien un programa completamente independiente

Este programa es quien sabe cómo interpretar el Este programa es quien sabe cómo interpretar el código de la página para devolver el HTML apropiadocódigo de la página para devolver el HTML apropiado

Page 6: Introduccion a ASP .NET 2.0

Introducción a ASPIntroducción a ASPIntroducción a ASPIntroducción a ASP

Antes de empezar a estudiar ASP .NET, Antes de empezar a estudiar ASP .NET, echemos un vistazo a la versión anterior echemos un vistazo a la versión anterior de la tecnología de páginas dinámicas de la tecnología de páginas dinámicas de Microsoft.de Microsoft.

Page 7: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 77

Requisitos de softwareRequisitos de softwareRequisitos de softwareRequisitos de software Uno de los inconvenientes de ASP es que es Uno de los inconvenientes de ASP es que es

dependiente de un servidor Web concretodependiente de un servidor Web concretoEl Internet Information Server (IIS)Internet Information Server (IIS) de Microsoft

Dicho servidor ya viene de manera predeterminada Dicho servidor ya viene de manera predeterminada en las últimas versiones de Windowsen las últimas versiones de Windows

Aunque quizá no lo hayamos instalado junto con el Sistema Operativo

– En ese caso, podríamos hacerlo a través de la opción de Añadir o quitar componentes de Windows del Panel de Control

¿Cómo probar si está instalado?– Teclear en el navegador http://localhost/http://localhost/

Page 8: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 88

Sintaxis generalSintaxis generalSintaxis generalSintaxis general ASP, al igual que las JSP de Java, se basa en ASP, al igual que las JSP de Java, se basa en

mezclar instrucciones de programación en nuestras mezclar instrucciones de programación en nuestras páginas HTMLpáginas HTML

El motor de ASP procesará dichas instrucciones El motor de ASP procesará dichas instrucciones dinámicamente y obviará el HTMLdinámicamente y obviará el HTML

Esto permite generar HTML dinámicamente, añadiendo lógica a nuestras páginas

Para ello, hay que encerrar el código ASP entre los Para ello, hay que encerrar el código ASP entre los símbolos símbolos <% %>

Page 9: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 99

Lenguaje de programaciónLenguaje de programaciónLenguaje de programaciónLenguaje de programación ¿Y en qué lenguaje se escriben esas instrucciones?¿Y en qué lenguaje se escriben esas instrucciones? ASP permite el uso de dos lenguajes:ASP permite el uso de dos lenguajes:

Visual Basic Script (VBScriptVBScript)JScript (como denomina Microsoft a su implementación de ECMAScript –que a su vez es el estándar de JavaScriptJavaScript–)

Si no decimos nada, por omisión asume VBScriptSi no decimos nada, por omisión asume VBScript

Page 10: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1010

Ejemplo: mi primera Ejemplo: mi primera página ASPpágina ASPEjemplo: mi primera Ejemplo: mi primera página ASPpágina ASP Será –¡cómo no!– el archiconocido Será –¡cómo no!– el archiconocido “Hola, mundo”“Hola, mundo” La página siguiente escribe dinámicamente el La página siguiente escribe dinámicamente el

mensajemensaje<html> <head> <title>Mi primera página ASP</title> </head> <body> <h1> <% Response.Write “¡Hola, mundo!" %> (mi primera página ASP) </h1></body> </html>

Page 11: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1111

Ejemplo de página ASPEjemplo de página ASPEjemplo de página ASPEjemplo de página ASP<%@ language=javascript %>

<script language='JScript' runat='server'>function Add(x, y){ return x+y;}</script>

<html> <body><h1>Test ASP Page</h1><h2>2+2=<%=Add(2,2)%></h2><table border='2'><% for (var i=0; i<10; i++) { %> <tr><td>Row<%=i%> Col0</td><td>Row<%=i%> Col1</td></tr><% } %></table>

<% Response.Write("<h2>Written directly to Response</h2>"); %>

</body> </html>

server-side function

interspersedserver-sidescript

server-sideevaluationsyntax

server-sidedirective

<%@ language=javascript %>

<% %>

<% %><% %> <% %>

<% %>

<% %>

test.asptest.asp

Page 12: Introduccion a ASP .NET 2.0

ASP .NETASP .NETASP .NETASP .NET

Es mucho más que la siguiente versión de ASP. Realmente, Es mucho más que la siguiente versión de ASP. Realmente, tiene poco que ver con el ASP tradicional; supone un tiene poco que ver con el ASP tradicional; supone un rediseño completo, integrado en la plataforma .NET, y hay rediseño completo, integrado en la plataforma .NET, y hay que cambiar la forma de hacer las cosas para adaptarnos a que cambiar la forma de hacer las cosas para adaptarnos a la nueva filosofía.la nueva filosofía.

Page 13: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1313

Arquitectura de Arquitectura de ASP .NETASP .NETArquitectura de Arquitectura de ASP .NETASP .NET

Seguridad, Caché, rendimiento…

Configuración(.config)

Servicio Web XML(.asmx)

Página Web Forms

(.aspx + fichero de clases)

Página Web Forms

(.aspx + fichero de clases)

Estado de la vistaEstado de la sesiónEstado de la aplicación

Proveedores de datosÓrdenes de datosDatasets

Lenguaje y compilaciónDepuraciónServicios del Sistema Operativoetc.

Entorno de ejecución de .NET

ADO .NET

Gestión de estado

Framework de páginas

Entorno de ejecución de ASP .NET

Page 14: Introduccion a ASP .NET 2.0

Anatomía de una página Anatomía de una página ASP .NETASP .NET

Anatomía de una página Anatomía de una página ASP .NETASP .NET

Para estudiar las diferencias entre ASP y Para estudiar las diferencias entre ASP y ASP .NET, comencemos creando nuestra ASP .NET, comencemos creando nuestra primera página ASP .NET a mano, primera página ASP .NET a mano, empleando sólo el bloc de notas.empleando sólo el bloc de notas.

Page 15: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1515

La página más simple La página más simple posibleposibleLa página más simple La página más simple posibleposible En su forma más simple, una página ASP .NET no es En su forma más simple, una página ASP .NET no es

más que HTML puromás que HTML puro Cualquier fichero con la extensión Cualquier fichero con la extensión .aspx.aspx será será

procesado por el entorno en tiempo de ejecución procesado por el entorno en tiempo de ejecución de .NET (de .NET (aspnet_wp.exeaspnet_wp.exe))

Si no hay ningún Si no hay ningún scriptscript en dicha página ni tampoco en dicha página ni tampoco referencias a ningún código externo (referencias a ningún código externo (“code-“code-behind file”behind file”) entonces la página es devuelta ) entonces la página es devuelta directamente al clientedirectamente al cliente

Page 16: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1616

Ejemplo: ¡Hola, mundo!Ejemplo: ¡Hola, mundo!Ejemplo: ¡Hola, mundo!Ejemplo: ¡Hola, mundo! Guardar el siguiente documento como Guardar el siguiente documento como HolaMundo.aspxHolaMundo.aspx::

<?xml version="1.0" encoding="ISO-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Mi primera página en ASP .NET</title> </head> <body> <h1>Mi primera página en ASP .NET</h1> <p>¡Hola, mundo!</p> </body></html>

Page 17: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1717

Ejecutar el ejemploEjecutar el ejemploEjecutar el ejemploEjecutar el ejemplo Cópiese al directorio Cópiese al directorio C:\Inetpub\wwwrootC:\Inetpub\wwwroot

O bien a algún subdirectorio o directorio virtual Y tecleamos en el navegador:Y tecleamos en el navegador:

http://localhost/HolaMundo.aspxhttp://localhost/HolaMundo.aspx

Page 18: Introduccion a ASP .NET 2.0

Formularios WebFormularios WebFormularios WebFormularios Web

Veamos un ejemplo de formularios Web en Veamos un ejemplo de formularios Web en HTML, para entender luego qué es lo que HTML, para entender luego qué es lo que hace ASP .NET y cómo se relaciona con hace ASP .NET y cómo se relaciona con éstos.éstos.

Page 19: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 1919

FormulariosFormulariosFormulariosFormularios Son la forma que hay en HTML de enviar datosSon la forma que hay en HTML de enviar datos

Page 20: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2020

Ejemplo de formulario en Ejemplo de formulario en HTMLHTMLEjemplo de formulario en Ejemplo de formulario en HTMLHTML...<form action="http://localhost/aspnet/formulario.asp" method="post"> <p> Nombre: <input type="text" name="nombre"/><br/> Apellidos: <input type="text" name="apellidos"/><br/> ¿Qué sistema operativo utilizas?<br/> <select name="sistemaOperativo"> <option value="Windows 98">Windows 98</option> <option value="Windows 2000">Windows 2000</option> <option value="Windows XP">Windows XP</option> <option value="Linux/Unix">Linux/Unix</option> </select><br/> <input type="submit"/> </p></form>...

Page 21: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2121

FormulariosFormulariosFormulariosFormularios Esos datos se envían al URL especificado en el Esos datos se envían al URL especificado en el

atributo atributo actionaction de de formform Hay dos métodos de envíoHay dos métodos de envío

GETGET– Los datos se codifican en el propio URL

POSTPOST– Viajan ocultos en el propio mensaje HTTP

Es lo habitual

Page 22: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2222

Recogida de los datosRecogida de los datosRecogida de los datosRecogida de los datos ¿Cómo se recogen esos datos en el servidor, en el ¿Cómo se recogen esos datos en el servidor, en el

URL especificado?URL especificado?Depende de la tecnología de páginas dinámicas que estemos empleandoVeamos un ejemplo sencillo en ASP tradicional que muestre un mensaje personalizado en función de los datos introducidos en el formulario anterior

Page 23: Introduccion a ASP .NET 2.0

El “¡Hola, Mundo!” conEl “¡Hola, Mundo!” conVisual Studio .NETVisual Studio .NET

El “¡Hola, Mundo!” conEl “¡Hola, Mundo!” conVisual Studio .NETVisual Studio .NET

Page 24: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2424

Creación del sitio webCreación del sitio webCreación del sitio webCreación del sitio web Creamos un nuevo sitio web:Creamos un nuevo sitio web:

En File → New Web Site…O a través de la ventana de inicio, en “proyectos recientes”

Page 25: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2525

Creación del sitio webCreación del sitio webCreación del sitio webCreación del sitio web Visual Studio 2005 elimina la necesidad de tener Visual Studio 2005 elimina la necesidad de tener

instalado el instalado el Internet Information ServerInternet Information ServerSe puede crear un “sitio web” en cualquier carpeta del sistema de ficheros localPara ello, especificaremos:– Location: File SystemFile System

El lenguaje será El lenguaje será C#C# La plantilla a utilizar es La plantilla a utilizar es ASP .NET Web SiteASP .NET Web Site

Page 26: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2626

Creación del sitio webCreación del sitio webCreación del sitio webCreación del sitio web

Page 27: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2727

Page 28: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2828

Code-behindCode-behindCode-behindCode-behind Es una de las mejores características de ASP .NETEs una de las mejores características de ASP .NET

Y que es aún mejor en ASP .NET 2.0 con las “clases parciales”

Permite separar el código HTML de la lógica de Permite separar el código HTML de la lógica de programaciónprogramación

Además, no hay que esperar a que el servidor web Además, no hay que esperar a que el servidor web nos dé los errores al mostrar la página, sino que nos dé los errores al mostrar la página, sino que podemos compilar el código como cualquier otra podemos compilar el código como cualquier otra claseclase

Y, con Visual Studio 2005, incluso depurar

Page 29: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 2929

Code-behindCode-behindCode-behindCode-behind Pulsando en Pulsando en Default.aspxDefault.aspx con el botón con el botón

secundario y seleccionando secundario y seleccionando View CodeView Code obtenemos: obtenemos:

Page 30: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3030

Clases parcialesClases parcialesClases parcialesClases parciales Ocultan gran parte del código generado Ocultan gran parte del código generado

automáticamente por Visual Studio 2005automáticamente por Visual Studio 2005Por ejemplo, aunque tenemos acceso a los controles de ASP .NET definidos en la página, no aparecen aquí como atributos de la claseLo mismo con las suscripciones a eventos

– Como veremos, se llama automáticamente a los manejadores de eventos, sin que veamos la asociación explícita entre el evento y su manejador, como ocurría en ASP .NET 1.0

Page 31: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3131

¿Y los estándares?¿Y los estándares?¿Y los estándares?¿Y los estándares? Con ASP .NET 2.0 es posible generar código Con ASP .NET 2.0 es posible generar código XHTML XHTML

StrictStrict válido válido Para ello, es necesario hacer lo siguiente:Para ello, es necesario hacer lo siguiente:

Añadir al sitio web un fichero de configuración (Web Web configuration fileconfiguration file) Web.configWeb.config

Añadir esta sección:<xhtmlConformance mode="Strict"/><xhtmlConformance mode="Strict"/>

dentro de <system.web><system.web>……<<//system.web>system.web>

Page 32: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3232

El El !DOCTYPE!DOCTYPEEl El !DOCTYPE!DOCTYPE También es necesario cambiar el También es necesario cambiar el !DOCTYPE!DOCTYPE que que

nos genera por éste:nos genera por éste:<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC

"-//W3C//DTD XHTML 1.0 Strict//EN" "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">strict.dtd">

E indicar el juego de caracteres de la página (en el E indicar el juego de caracteres de la página (en el <head><head>):):<meta http-equiv="Content-Type" <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>content="text/html; charset=iso-8859-1"/>

Page 33: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3333

Fichero Fichero Default.aspxDefault.aspxFichero Fichero Default.aspxDefault.aspx Representa la página en síRepresenta la página en sí

El código HTML junto con los controles de ASP .NET Lo renombraremos apropiadamenteLo renombraremos apropiadamente

Por ejemplo, HolaMundo.aspxHolaMundo.aspx

En Visual Studio, no hace falta escribir el código de En Visual Studio, no hace falta escribir el código de los controles a manolos controles a mano

Podemos arrastrar y soltar desde el Cuadro de HerramientasCuadro de Herramientas– La pestaña que está en el lateral izquierdo de la ventana– Podemos modificar sus propiedades desde el cuadro de PropiedadesPropiedades

Page 34: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3434

““¡Hola, mundo!” desde Visual ¡Hola, mundo!” desde Visual StudioStudio““¡Hola, mundo!” desde Visual ¡Hola, mundo!” desde Visual StudioStudio Arrastramos un control estándar Arrastramos un control estándar LabelLabel Podemos cambiar a la vista del Podemos cambiar a la vista del

diseñador pulsando en la pestaña que diseñador pulsando en la pestaña que está en la parte inferior izquierda de la está en la parte inferior izquierda de la fichaficha

<asp:Label ID="LabelTexto" <asp:Label ID="LabelTexto" runat="server"runat="server" Text="¡Hola, mundo!"></asp:Label>Text="¡Hola, mundo!"></asp:Label>

Page 35: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3535

ComentariosComentariosComentariosComentarios <asp:Label><asp:Label> es un es un Control WebControl Web de ASP .NET de ASP .NET

Uno de los muchos incluidos en el Framework .NET El atributo El atributo runat=“server”runat=“server” indica que se ejecutará en el indica que se ejecutará en el

servidorservidorQuien se encargará de generar el código HTML apropiado para él

– En este caso, simplemente envuelve el texto en un elemento <span> de HTML

Todos los controles Web de ASP .NET deben estar dentro de Todos los controles Web de ASP .NET deben estar dentro de un formulario que también tenga el atributo un formulario que también tenga el atributo runat=“server”runat=“server”

Page 36: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3636

Probar la páginaProbar la páginaProbar la páginaProbar la página Con Con BuildBuild → → Build Web SiteBuild Web Site compilamos toda la compilamos toda la

aplicaciónaplicación La “ejecutamos” en el menú La “ejecutamos” en el menú Debug Debug → → Start Without Start Without

DebuggingDebugging

Page 37: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3737

DepuraciónDepuraciónDepuraciónDepuración Si queremos depurar (Si queremos depurar (Debug Debug → → Start DebuggingStart Debugging)) Y activar la depuración en el fichero de Y activar la depuración en el fichero de

configuraciónconfiguraciónNos pregunta si quiere que lo haga él automáticamente

Page 38: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3838

Resultado de la ejecuciónResultado de la ejecuciónResultado de la ejecuciónResultado de la ejecución

Page 39: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 3939

Código HTML generadoCódigo HTML generadoCódigo HTML generadoCódigo HTML generado<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>Mi primera página en ASP .NET 2.0</title></head><body> <form method="post" action="HolaMundo2.aspx" id="Formulario"> <div> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJODExMDE5NzY5ZGTdbN3enHNBxNy+SDXXLonJDUrO3Q==" /> </div> <div> <span id="LabelTexto">¡Hola, mundo!</span> </div> </form></body></html>

Page 40: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4040

Manejo de eventosManejo de eventosManejo de eventosManejo de eventos Uno de los mayores avances de ASP .NET sobre su Uno de los mayores avances de ASP .NET sobre su

predecesor es la capacidad del manejo de eventos predecesor es la capacidad del manejo de eventos desde una perspectiva orientada a objetosdesde una perspectiva orientada a objetos

Veamos cómo hacer que al pulsar un botón en la Veamos cómo hacer que al pulsar un botón en la página cambie el texto del mensajepágina cambie el texto del mensaje

Page 41: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4141

EventosEventosEventosEventos Formas de añadir los Formas de añadir los manejadores de eventosmanejadores de eventos::

Desde el código HTMLDesde la vista de diseño

– Haciendo doble clic sobre el control se generará el manejador para el evento predefinido del control

– También podemos crear cualquier otro manejador en la ventana de propiedades

Page 42: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4242

Añadir un botónAñadir un botónAñadir un botónAñadir un botón

¿Qué es lo que ponemos en el evento ¿Qué es lo que ponemos en el evento onclickonclick??El nombre de la función (realmente será un método de la clase correspondiente a esta página) que queremos que maneje dicho evento

– Será llamado automáticamente cuando se produzca el evento

...<form method=“post” runat=“server”> <asp:Label id=“Mensaje” text=“¡Hola, Mundo!” runat=“server”/><br/> <asp:Button onclick="CambiarSaludo" text="Púlsame“ runat="server"/></form>...

Page 43: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4343

Definición del manejadorDefinición del manejadorDefinición del manejadorDefinición del manejador Escribimos lo siguiente en el método que nos Escribimos lo siguiente en el método que nos

genera:genera:

...protected void CambiarSaludo(object sender, EventArgs e){ Mensaje.Text = "¡Bienvenido a ASP .NET!“}

...

Page 44: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4444

ComentariosComentariosComentariosComentarios Le hemos dado un identificador (Le hemos dado un identificador (idid) a la etiqueta ) a la etiqueta

((LabelLabel) para poder acceder a ella por programa) para poder acceder a ella por programaAntes se lo daba ASP .NET automáticamente por nosotros

En el manejador del botón modificamos su En el manejador del botón modificamos su propiedad propiedad TextText

(Los controles de .NET son clases que tienen sus correspondientes métodos y propiedades)

Una vez pulsado el botón (el texto cambiará), ¿qué Una vez pulsado el botón (el texto cambiará), ¿qué ocurre si actualizamos la página?ocurre si actualizamos la página?

Page 45: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4545

Acerca del estadoAcerca del estadoAcerca del estadoAcerca del estado Que el estado permaneceQue el estado permanece

El texto no vuelve a ser el “¡Hola, mundo!” original, sino que queda con el último valor

¿Cómo es posible esto?¿Cómo es posible esto?Porque lo hace ASP .NET por nosotros

– Todos los controles de un formulario mantienen los valores que tuvieran la última vez

– Esto lo hace ASP .NET a través del campo _VIEWSTATE_VIEWSTATE Un elemento <input><input> oculto que mete automáticamente en el

formulario con un ristra de datos que contienen todos los valores de los campos

– Es una característica nueva de ASP .NET

Page 46: Introduccion a ASP .NET 2.0

Eventos en ASP .NET 1.0Eventos en ASP .NET 1.0Eventos en ASP .NET 1.0Eventos en ASP .NET 1.0

La mayor parte del código siguiente es transparente La mayor parte del código siguiente es transparente para el programador en ASP .NET 2.0.para el programador en ASP .NET 2.0.

Page 47: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4747

Eventos de la páginaEventos de la páginaEventos de la páginaEventos de la página Una página ASP .NET pasa por una serie de Una página ASP .NET pasa por una serie de

estados a lo largo de su ciclo de vidaestados a lo largo de su ciclo de vida1. Se inicializainicializa la página

Se crean los objetos de los controles y se establecen los manejadores de eventos

2. Se procesa el estado de la vistaestado de la vista (_VIEWSTATE_VIEWSTATE), poblando los controles con los últimos datos que tuvieran

3. Se lanza el evento LoadLoadAquí es donde comenzaremos a escribir la lógica de nuestra página

4. Se llama a los manejadores de eventosmanejadores de eventos correspondientes a las acciones de usuario que hayan tenido lugar

Page 48: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4848

Eventos de la páginaEventos de la páginaEventos de la páginaEventos de la página5. Se salva el estado de la vista6. Se muestra la página

Page 49: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 4949

InitInitInitInit Es el primer evento que tiene lugarEs el primer evento que tiene lugar ASP .NET crea todos los controles de la páginaASP .NET crea todos los controles de la página Visual Studio también añadirá aquí los manejadores Visual Studio también añadirá aquí los manejadores

de los eventos de usuario que hayamos definidode los eventos de usuario que hayamos definido

override protected void OnInit(EventArgs e){ InitializeComponent(); base.OnInit(e);}

private void InitializeComponent(){ this.Load += new System.EventHandler(this.Page_Load);}

Page 50: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5050

Eventos. Manejadores y Eventos. Manejadores y delegadosdelegadosEventos. Manejadores y Eventos. Manejadores y delegadosdelegados ¿Qué significa esta línea?¿Qué significa esta línea?

this.Load += new System.EventHandler(this.Page_Load);this.Load += new System.EventHandler(this.Page_Load);

Es como nos suscribimos a los eventos en C#Es como nos suscribimos a los eventos en C#Mediante lo que se denominan delegadosdelegados

Asocia al evento Asocia al evento Load Load de la página el método de la página el método Page_LoadPage_Load

Se llamará automáticamente a dicho manejadormanejador cuando se produzca el eventoQue deberá concordar con la signatura del delegado System.EventHandlerSystem.EventHandler

public delegate void EventHandler(object sender, EventArgs e);

Page 51: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5151

LoadLoadLoadLoad Este evento se produce justo después de Este evento se produce justo después de InitInit

Aquí ya está disponible el estado de la vistaAquí ya está disponible el estado de la vistaYa podemos mirar qué valores tienen los controles y procesar la página como corresponda

La clase La clase PagePage define una propiedad define una propiedad IsPostBackIsPostBack

Permite saber si es la primera vez que se llama a la página o si es que ya ha sido devuelta por el clienteHay código que con ASP .NET, al mantener el estado, sólo necesitaríamos ejecutar la primera vez

– Por ejemplo, obtener datos de una base de datos para poblar los controles

Page 52: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5252

Un manejador típico para Un manejador típico para LoadLoadUn manejador típico para Un manejador típico para LoadLoadprivate void Page_Load(object sender, System.EventArgs e){ // Código que queremos que se ejecute cada vez (por ejemplo, // establecer la conexión a la base de datos que se usará luego // en el resto de la página) if (!IsPostBack) { // Código que sólo se ejecuta la primera vez (por ejemplo, // obtener datos de la base de datos para rellenar los controles) } else { // Código que se ejecuta sólo cuando la página ha sido devuelta // desde el cliente (por ejemplo, comprobaciones de los datos // introducidos por el cliente en un formulario) }}

Page 53: Introduccion a ASP .NET 2.0

Más controles de ASP .NETMás controles de ASP .NETMás controles de ASP .NETMás controles de ASP .NET

Ya hemos visto los controles Ya hemos visto los controles LabelLabel y y ButtonButton. Veamos ahora, mediante . Veamos ahora, mediante ejemplos, algunos otros de los que nos ejemplos, algunos otros de los que nos proporciona ASP .NET.proporciona ASP .NET.

Page 54: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5454

Mostrar la hora actualMostrar la hora actualMostrar la hora actualMostrar la hora actual Hacer una página que, al pulsar un botón, actualice Hacer una página que, al pulsar un botón, actualice

la horala horaHágase uso de la clase DateTime DateTime de la biblioteca de .NET

– Concretamente, DateTime.NowDateTime.Now devuelve la hora actual Luego, llamar a sus propiedades HourHour, MinuteMinute y SecondSecond, y al método ToStringToString de cada una de ellas para añadirlas al campo LabelLabel

Page 55: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5555

Control Control CheckBoxCheckBoxControl Control CheckBoxCheckBox La típica casilla de verificaciónLa típica casilla de verificación Tiene un método Tiene un método CheckedChecked que permite saber si está que permite saber si está

seleccionada o noseleccionada o no

Page 56: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5656

EjercicioEjercicioEjercicioEjercicio Añadir, al ejemplo anterior, una casilla que permita Añadir, al ejemplo anterior, una casilla que permita

seleccionar si se quieren mostrar los segundos o noseleccionar si se quieren mostrar los segundos o no

Page 57: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5757

Controles de tablaControles de tablaControles de tablaControles de tabla Permiten crear una tabla de HTML:Permiten crear una tabla de HTML:

<table><table>

<tr><tr>

<td>(1, 1)</td><td>(1, 1)</td>

<td>(1, 2)</td><td>(1, 2)</td>

<td>(1, 3)</td><td>(1, 3)</td>

</tr></tr>

<tr><tr>

<td>(2, 1)</td><td>(2, 1)</td>

<td>(2, 2)</td><td>(2, 2)</td>

<td>(2, 3)</td><td>(2, 3)</td>

</tr></tr>

</table></table>

(1, 1)(1, 1) (1, 2)(1, 2) (1, 3)(1, 3)

(2, 1)(2, 1) (2, 2)(2, 2) (2, 3)(2, 3)

Page 58: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5858

Controles de tablaControles de tablaControles de tablaControles de tabla ASP .NET proporciona los siguientes controles Web ASP .NET proporciona los siguientes controles Web

básicos para crear una tabla (hay otros más básicos para crear una tabla (hay otros más complejos):complejos):

TableTable

TableRowTableRow

TableCellTableCell

Page 59: Introduccion a ASP .NET 2.0

Comercio Electrónico (EUITIO). Curso 2007-2008Comercio Electrónico (EUITIO). Curso 2007-2008 5959

EjercicioEjercicioEjercicioEjercicio Crear dinámicamente una tabla para mostrar los Crear dinámicamente una tabla para mostrar los

contenidos de dos colecciones como éstas:contenidos de dos colecciones como éstas:

private string[] peliculas = new string[] { "El río de la vida", "You're the one", "El abuelo", "Historia de un beso", "La leyenda de Bagger Vance", "Un lugar llamado Milagro" };

private string[] año = new string[] { "1992", "2000", "1998", "2002", "2000", "1988" };