Documente Academic
Documente Profesional
Documente Cultură
UCENM
INTRODUCCION
En un principio la web era sencillamente una coleccin de pginas estticas, documentos, etc., para su consulta o descarga. El paso inmediatamente posterior en su evolucin fue la inclusin de un mtodo para elaborar pginas dinmicas que permitieran que lo mostrado tuviese carcter dinmico (es decir, generado a partir de los datos de la peticin). Este mtodo fue conocido como CGI ("Common Gateway Interface") y defina un mecanismo mediante el que se poda pasar informacin entre el servidor y ciertos programas externos. Los CGIs siguen utilizndose ampliamente; la mayora de los servidores web permiten su uso debido a su sencillez. Adems, dan total libertad para elegir el lenguaje de programacin que se desea emplear. El funcionamiento de los CGIs tena un punto dbil: cada vez que se reciba una peticin, el servidor deba lanzar un proceso para ejecutar el programa CGI. Como la mayora de CGIs estaban escritos en lenguajes interpretados, como Perl o Python, o en lenguajes que requeran "run-time environment", como Java o VisualBasic, el servidor se vea sometido a una gran carga. La concurrencia de mltiples accesos al CGI poda comportar problemas graves. Por eso se empiezan a desarrollar alternativas a los CGIs que solucionaran el problema del rendimiento. Las soluciones llegan bsicamente por 2 vas: 1) se disean sistemas de ejecucin de mdulos mejor integrados con el servidor, que evitan la instanciacin y ejecucin de varios progrmas, y 2) se dota a los servidores un intrprete de algn lenguaje de programacin que permita incluir el cdigo en las pginas de forma que lo ejecute el servidor, reduciendo el intervalo de respuesta. Entonces se experimenta un aumento del nmero de arquitecturas y lenguajes que permiten desarrollar aplicaciones web. Todas siguen alguna de estas vas. Las ms tiles y las ms utilizadas son las que permiten mezclar los 2 sistemas: un lenguaje integrado que permita al servidor interpretar comandos "incrustados" en las pginas HTML y, adems, un sistema de ejecucin de programas mejor enlazado con el servidor, que no implique los problemas de rendimiento propios de los CGIs. La popularidad de las Aplicaciones Web se debe a que basta con tener solamente una PC, un navegador Web y acceso a la Internet. La facilidad de uso, la habilidad para actualizar y mantener aplicaciones Web sin distribuir e instalar software es otra razn de su enorme popularidad. Una aplicacin Web es aquella que los usuarios usan accediendo a un servidor Web a travs de Internet o de una intranet. Esto es igual que entrar a www.mercadeo.com u otro sitio Web que se encuentra en la Internet. Las aplicaciones Web son cada da ms comunes, debido a la popularidad y extensin que tiene la Internet. La facilidad para usar, actualizar y mantener aplicaciones Web, sin distribuir e instalar software, es otra razn de su popularidad. Esto sin mencionar el bajsimo costo de las mismas. Las aplicaciones Web, por ejemplo un programa de contabilidad, generan en forma dinmica pginas en formato HTML o XHTML. Generalmente cada pgina Web individual es vista por el cliente como un formulario o documento esttico, pero la secuencia de pginas provee de una experiencia interactiva.
Desarrollo web
OBJETIVOS
-Describir lo temas de desarrollo web de una manera practica y rapida. -Presentar los lenguajes soportados para el desarrollo enfoncandonos principalmente en HTML, CSS, ASP.NET y Visual Basic que es el complemento para explotar al maximo ASP.NET.
-Presentar los principales serivicios y caracteristicas de estas tecnologia para el desarrollo web.
-Explicar como encajan ambas tecnologias a medida que vayamos avanzando en este libro.
Desarrollo web
Indice
Conceptos Bsicos y Estructura de HTML Partes del Documento Formatos de Prrafos en HTML Encabezados Formato de Texto Atributos de Pagina Enlaces en HTML Imagenes en HTML Tablas en HTML Formulario CSS Hojas de Estilo en Cascada Sintaxis Definicin de Hojas de Estilos Identificadores y las Clases Seleccion Contextual Especificacin de estilo Para Elementos Individuales Formato de Elemento de Bloque Pseudo Clase Selector Tablas en CSS VB.NET Microsoft Visual Studio.Net Declaracin de variables Estructuras de Control Bucles y/o Ciclos Procedimientos y Funciones Clases en VB.Net Plataforma Microsoft .NET Plataforma Microsoft .NET NET Framework Componentes del .NET Frameworke Espacios de Nombres ASP.NET 2.0 Introduccin ASP.NET Planear un Sitio web de ASP.NET Requisitos Instalacin de IIS Entorno desarrollador Visual Studio.NET Crear Formularios Web Forms con ASP.NET Uso de controles de Servidor Crear cdigo HTML especfico del navegador Tipos de controles de servidor Agregar cdigo a un formulario Web Form con Microsoft ASP.NET Qu son las pginas de cdigo subyacente? Uso de los eventos de pgina Acceso a datos con Microsoft ADO.NET Conexin a una base de datos Acceso a datos con DataSets. Utilizar un DataView Administracin del estado Tipos de administracin del estado El archivo Global.asax Variables de aplicacin y de sesin Sesiones con y sin cookies 5 6 7 10 12 13 15 18 20 27 41 44 45 49 50 51 52 54 55 61 62 63 63 64 65 67 68 68 69 71 73 74 76 82 82 85 86 90 91 92 104 105 109 114 116 119 122 124 125 127 129 131
Desarrollo web
HTML
Partes del Documento Formatos de Prrafos en HTML Encabezados Formato de Texto Atributos de Pagina Enlaces en HTML Imagenes en HTML Tablas en HTML Formularios
6 7 10 12 13 15 18 20 27
Desarrollo web
INTRODUCCION A HTML
HTML es el lenguaje con el que se escriben las pginas web. Las paginas web pueden ser vistas por el usuario mediante un tipo de aplicacin llamada navegador. Podemos decir por lo tanto que el HTML es el lenguaje usado por los navegadores para mostrar las paginas webs al usuario, siendo hoy en dia la interface mas extendida en la red. Este lenguaje nos permite aglutinar textos, sonidos e imagenes y combinarlos a nuestro gusto. Adems, y es aqui donde reside su ventaja, el HTML nos permite la introduccin de referencias a otras paginas por medio de los enlaces hipertexto. El HTML se creo en un principio con objetivos divulgativos. No se penso que la web llegara a ser un rea de ocio con carcter multimedia, de modo que, el HTML se creo sin dar respuesta a todos los posibles usos que se le iba a dar y a todos los colectivos de gente que lo utilizaran en un futuro. Sin embargo, pese a esta deficiente planificacin, si que se han ido incorporando modificaciones con el tiempo, estos son los estandares del HTML. Numerosos estandares se han presentado ya. El HTML 4.01 es el ultimo estandar a septiembre de 2001. Esta evolucion tan anarquica del HTML ha supuesto toda una seria de inconvenientes y deficiencias que han debido ser superados con la introduccion de otras tecnologias accesorias capaces de organizar, optimizar y automatizar el funcionamiento de las webs. Ejemplos son las CSS, JavaScript u otros. Otros de los problemas que han acompanado al HTML es la diversidad de navegadores presentes en el mercado los cuales no son capaces de interpretar un mismo cdigo de una manera unificada. Esto obliga al desarrollador web a, una vez creada su pagina, comprobar que esta puede ser leda satisfactoriamente por todos los navegadores, o al menos, los mas utilizados. Adems del navegador necesario para ver los resultados de nuestro trabajo, necesitamo sevidentemente otra herramienta capaz de crear la pagina en si. Un archivo HTML (una pagina) noes mas que un texto. Es por ello que para programar en HTML necesitamos un editor de textos. Es recomendable usar el Bloc de notas que viene con windows, u otro editor de textos sencillo para nuestros fines utilizaremos la macromedia dreamweber. Hay que tener cuidado con algunos editores mas complejos como Wordpad o Microsoft Word, pues colocan su propio codigo especial al guardar las paginas y HTML es nicamente texto plano, con lo que podremos tener problemas. Existen otro tipo de editores especficos para la creacin de paginas web los cuales ofrecen muchas facilidades que nos permiten aumentar nuestra productividad. No obstante, es aconsejable en un principio utilizar una herramienta lo mas sencilla posible para poder prestar la maxima atencion a nuestro codigo y familiarizarnos lo antes posible con el. Es importante tener claro todo ello puesto que en funcion de vuestros objetivos puede que, masque aprender HTML, resulte mas interesante aprender el uso de una aplicacion para la creacion de paginas.
Desarrollo web
<b>Esto esta en negrita</b> El resultado Sera: Esto esta en negrita Las etiquetas <p> y </p> definen un parrafo. Si en nuestro documento HTML escribieramos: <p>Hola, estamos en el parrafo 1</p> <p>Ahora hemos cambiado de parrafo</p> El resultado seria: Hola, estamos en el parrafo 1 Ahora hemos cambiado de parrafo Asi pues, una pagina es un archivo donde esta contenido el codigo HTML en forma de texto. Estos archivos tienen extension .html o .htm (es indiferente cual utilizar). De modo que cuando programemos en HTML lo haremos con un editor de textos y guardaremos nuestros trabajos con extension .html, por ejemplo mipagina.html
Desarrollo web
Las maysculas o minsculas son indiferentes al escribir etiquetas. A notar que las etiquetas pueden ser escritas con cualquier tipo de combinacion de mayusculas y minsculas. <html>, <HTML> o <HtMl> son la misma etiqueta. Resulta sin embargo aconsejable acostumbrarse a escribirlas en minscula ya que otras tecnologas que pueden convivir con nuestro HTML (XML por ejemplo).
Desarrollo web
Si ahora hacemos click con el boton derecho sobre la pagina y elegimos Ver codigo fuente (o View page source) veremos como en una ventana aparece el cdigo de nuestra pagina. Este recurso es de extremada importancia ya que nos permite ver el tipo de tcnicas empleadas por otros para la confeccin de pginas.
Desarrollo web
Formato de Prrafo
Como vemos, en cada caso el atributo align toma determinados valores que son escritos entre comillas. En algunas ocasiones necesitamos especificar algunos atributos para el correcto funcionamiento de la etiqueta. En otros casos, el propio navegador toma un valor definido por defecto. Para el caso de align, el valor por defecto es left. Ejercicip prctico: Para practicar un poco lo que acabamos de ver vamos a proponer un ejercicio que podemos resolver en nuestras maquinas. Simplemente queremos construir una pagina que tenga, por este orden: 2 Parrafos centrados 3 Parrafos alineados a la derecha Un salto de linea triple 1 parrafo alineado a la izquierda
Encabezados
Existen otras etiquetas para definir parrafos especiales, formateados como titulos. Son los encabezados o Header en ingles. Hay varios tipos de encabezados, que se diferencian en el tamao de la letra que utilizan. La etiqueta en concreto es la <h1>, para los encabezados mas grandes, <h2> para los de segundo nivel y as hasta <h6> que es el encabezado mas pequeo. <h1>Encabezado de nivel 1</h1> Se vera de esta manera en la pagina: Encabezado de nivel 1
Desarrollo web
10
Encabezados
Formateando el texto
Adems de todo lo relativo a la organizacin de los prrafos, uno de los aspectos primordiales del formateo de un texto es el de la propia letra. Resulta muy comn y practico presentar texto resaltado en negrita, itlica y otros. Paralelamente el uso de ndices, subndices resulta vital para la publicacin de textos cientficos. Todo esto y mucho ms es posible por medio del HTML a partir de multitud de etiquetas entre las cuales vamos a destacar algunas. -Negrita Podemos escribir texto en negrita incluyendolo dentro de las etiquetas <b> y </b> (bold). Esta misma tarea es desempeada por <strong> y </strong> siendo ambas equivalentes. Nosotros nos inclinamos por la primeras por simple razn de esfuerzo.
Desarrollo web
11
Formato de Texto
-Subndices y suprandices Este tipo de formato resulta de extremada utilidad para textos cientficos. Las etiquetas empleadas son: <sup> y </sup> para los supraindices <sub> y </sub> para los subndices Aqu tenemos un ejemplo: La <sup>13</sup>CC<sub>3</sub>H<sub>4</sub>ClNOS es un heterociclo alergeno enriquecido. Anidar etiquetas Todas estas etiquetas y por supuesto el resto de las vistas y que veremos mas adelante pueden ser anidadas unas dentro de otras de manera a conseguir resultados diferentes. Asi, podemos sin ningn problema crear texto en negrita e italica embebiendo una etiqueta dentro de la otra: <b>Esto solo esta en negrita <i>y esto en negrita e italica</i></b> Esto nos daria: Esto slo est en negrita y esto en negrita e itlica
Desarrollo web
12
Formato de Texto
Desarrollo web
13
Atributos de Pgina
-Color del texto text: este atributo sirve para asignar el color del texto de la pagina. Por defecto es el negro. link: el color de los enlaces que no han sido visitados. (por defecto es azul clarito) vlink: el color de los enlaces visitandos. La "v" viene justamente de la palabra visitado. Es el color que tendran los enlaces que ya hemos visitado. Ejemplo de color del texto Vamos a ver una pagina donde el color de fondo sea negro, y los colores del texto y los enlaces sean claros. Pondremos el color de texto blanco y los enlaces amarillos, mas resaltados los que no estn visitados y menos resaltados lo que ya estn visitados. Para ello escribiramos la etiqueta body as: <html> <head> <Title>Color del Texto</title> </head> <body bgcolor="#000000" text="#ffffff" link="#ffff33" alink="#ffffcc" vlink="ffff00"> <p><b>Bienvenido,</b></p> <p>Estas en la pagina <b>Comida para Todos</b>.</p> <p>Aqui aprenderas recetas faciles y deliciosas.</p> <P><a href=http://www.google.org>Aqui aprenderas obtendras recetas faciles y deliciosas.</a></p> </body> </html>
Desarrollo web
14
Atributos de Pgina
Esta pagina tiene el fondo blanco y dentro una tabla con el fondo rojo. En la pagina podremos ver que la tabla ocupa el espacio en la pagina sin dejar sitio para ningn tipo de margen. Enlaces en HTML Hasta aqu, hemos podido ver que una pagina web es un archivo HTML en el que podemos incluir, entre otras cosas, textos formateados a nuestro gusto e imgenes (las veremos enseguida). Del mismo modo, un sitio web podr ser considerado como el conjunto de archivos, principalmente paginas HTML e imgenes, que constituyen el contenido al que el navegante tiene acceso.
Desarrollo web
15
Enlaces
-Enlaces internos <a href="#abajo">Ir abajo</a> El smbolo #; es el quien especifica al navegador que el enlace apunta a una seccin en particular. -Enlaces locales Para crear este tipo de enlaces, hemos de crear una etiqueta de la siguiente forma: <a href="archivo.html">contenido</a>
Para hacer un enlace desde index.html hacia yyy.html: <a href="seccion1/paginas/yyy.html">contenido</a> Para hacer un enlace desde xxx.html hacia yyy.html: <a href="../seccion1/paginas/yyy.html">contenido</a> Para hacer un enlace desde yyy.html hacia xxx.html: <a href="../../seccion2/xxx.html">contenido</a>
Los enlaces locales pueden a su vez apuntar ya no a la pagina en general sino mas precisamente a una seccin concreta. Este tipo de enlaces resultan ser un hibrido de interno y local. La sintaxis es de este tipo: <a href="archivo.html#seccion">contenido</a>
Desarrollo web
16
Enlaces
Desarrollo web
17
Enlaces
Imgenes en HTML
Sin duda uno de los aspectos mas vistosos y atractivos de las paginas web es el grafismo. La introduccin en nuestro texto de imgenes puede ayudarnos a explicar mas fcilmente nuestra informacin y darle un aire mucho mas esttico. El abuso no obstante puede conducirnos a una sobrecarga que se traduce en una distraccin para el navegante, quien tendr mas dificultad en encontrar la informacin necesaria, y un mayor tiempo de carga de la pagina lo que puede ser de un efecto nefasto si nuestro visitante no tiene una buena conexin o si es un poco impaciente.
Desarrollo web
18
Imgenes
Para efectos de explicacin los nombres de la imgenes no las veran si copian el contenido tal y como esta aqu en este ejemplo: Reemplacen las imgenes por otras que puedan tener en su computadora copiando exactamente la direccin donde se encuentra, en este ejemplo use un directorio local. Para un directorio remoto utilizar de la siguiente forma: <img src=http://www.dibujos.com/images/REY.jpg width=200 align=left alt=Dibujo de un Rey>
Desarrollo web
19
Tablas
Las tablas son descritas por lineas de izquierda a derecha. Cada una de estas lineas es definida por otra etiqueta y su cierre: <tr> y </tr>. Asimismo, dentro de cada linea, habra diferentes celdas. Cada una de estas celdas sera definida por otro par de etiquetas: <td> y </td>. Dentro de estas etiquetas sera donde coloquemos nuestro contenido. <html> <head> <Title>Tablas</title> </head> <Body > <Table borde=1> <tr> <td>Celda 1, linea 1</td> <td> Celda 2, linea 1</td> </tr> <tr> <td> Celda 1, linea 2</td> <td> Celda 2, linea 2</td>
Desarrollo web
20
A partir de esta idea simple y sencilla, las tablas adquieren otra magnitud cuando les incorporamos toda una batera de atributos aplicados sobre cada tipo de etiquetas que las componen.
Tablas
Tablas en HTML. Atributos para filas y celdas. Hemos visto en el capitulo anterior que las tablas estan compuestas de lineas que, a su vez, contienen celdas. Las celdas son delimitadas por las etiquetas <td> o por las etiquetas <th> (si queremos texto en negrita y centrado) y constituyen un entorno independiente del resto del documento. Esto quiere decir que: Podemos usar prcticamente cualquier tipo de etiqueta dentro de la etiqueta <td> para, de esta forma, dar forma a su contenido. Las etiquetas situadas en el interior de la celda no modifican el resto del documento. Las etiquetas de fuera de la celda no son tenidas en cuenta por esta. La forma mas til y actual de dar forma a las celdas es a partir de las hojas de estilo en cascada que ya tendremos la oportunidad de abordar mas adelante. Empecemos viendo atributos que nos permiten modificar una celda en concreto o toda una lnea: Align: Justifica el texto de la celda del mismo modo que si
Desarrollo web
21
Tablas
Desarrollo web
22
Tablas
Tablas en HTML. Atributos de la tabla y conclusin. Ademas de los atributos especificos de cada celda o linea, las tablas pueden ser adicionalmente formateadas a partir de los atributos que nos ofrece la propia etiqueta <table>. He aqui aquellos que pueden parecernos en un principio importantes: -align: Alinea horizontalmente la tabla con respecto a suentorno. -background: Nos permite colocar un fondo para la tabla a partir de un enlace a una imagen. -bgcolor: Da color de fondo a la tabla. -border: Define el numero de pixels del borde principal. -bordercolor: Define el color del borde. -cellpadding: Define, en pixels, el espacio entre los bordes de la
Desarrollo web
23
Tablas
Tablas anidadas Muy util tambin es el uso de tablas anidadas. De la misma forma que podamos incluir listas dentro de otras listas, las tablas pueden ser incluidas dentro de otras. As, podemos incluir una tabla dentro de la celda de otra. El modo de funcionamiento sigue siendo el mismo aunque la situacin puede complicarse si el numero de tablas embebidas dentro de otras es elevado. Vamos a ver un cdigo de anidacin de tablas. Veamos primero el resultado y luego el
Desarrollo web
24
Tablas
Desarrollo web
25
Tabla de Animales en peligro de extincin: Recrea la misma poniedo en practica el los codigos HTML que hasta ahora hemos adquirido.
Tablas
Desarrollo web
26
Formularios
Desarrollo web
27
Formularios
Enctype Se utiliza para indicar la forma en la que viajara la informacin que se mande por el formulario. En el caso ms corriente, enviar el formulario por correo electrnico, el valor de este atributo debe de ser "text/plain". As conseguimos que se envi el contenido del formulario como texto plano dentro del email. Si queremos que el formulario se procese automticamente por un programa, generalmente no utilizaremos este atributo, de modo que tome su valor por defecto, es decir, no incluiremos enctype dentro de la etiqueta <form> Ejemplo de etiqueta <form> completa Asi, para el caso mas habitual -el envi del formulario por correo- la etiqueta de creacin del formulario tendr el siguiente aspecto: <form action="mailto:direccion@correo.com (o nombre del archivo de proceso)" method="post" enctype="text/plain"> Entre esta etiqueta y su cierre colocaremos el resto de etiquetas que darn forma a nuestro formulario, las cuales sern vistas en captulos siguientes.
Desarrollo web
28
Formularios
De este modo expresamos nuestro deseo de crear una caja de texto cuyo contenido ser llamado nombre (por ejemplo). El aspecto de este tipo de cajas es de sobra conocido:
Caja de texto
<html> <head> <title>Formularios</title> </head> <body> <form action="prueba1.htm" method="post"> <h1>Caja de Texto</h1> <input type="text" name="nombre"> </form> </body> </html>
Desarrollo web
29
Formularios
Texto oculto Podemos esconder el texto escrito por medios asteriscos de manera a aportar una cierta confidencialidad. Este tipo de campos son anlogos a los de texto con una sola diferencia: remplazamos el atributo type="text" por type="password": <input type="password" name="nombre"> En este caso, podemos comprobar que al escribir dentro del campo en lugar de texto veremos asteriscos. Estos campos son ideales para la introduccin de datos confidenciales, principalmente cdigos de acceso. <html> <head> <title>Formularios</title> </head> <body>
Desarrollo web
30
Formularios
Texto largo Si deseamos poner a la disposicin de usuario un campo de texto donde pueda escribir cmodamente sobre un espacio compuesto de varias lneas, hemos de invocar una nueva etiqueta: <textarea> y su cierre correspondiente. Este tipo de campos son practicos cuando el contenido a enviar no es un nombre telefono o cualquier otro dato breve, sino mas bien, un comentario, opinion, etc. Dentro de la etiqueta textarea deberemos indicar, como para el caso visto anteriormente, el atributo name para asociar el contenido a un nombre que sera asemejado a una variable en los programas de proceso. Adems, podemos definir las dimensiones del campo a partir de los atributos siguientes: Rows: Define el numero de lneas del campo de texto. cols:Define el nmero de columnas del campo de texto. La etiqueta queda por tanto de esta forma: <textarea name="comentario" rows="10" cols="40"></textarea>
Desarrollo web
31
<form action="prueba1.htm" method="post"> <h1>Caja Texto Largo</h1> <textarea name="comentario" rows="10" cols="40">Puede escribir aqu tus comentarios</textarea> </form> </body> </Html>
Desarrollo web
32
Formularios
<form action="prueba1.htm" method="post"> <h1>Listas desplegables</h1> <select name="estacion"> <option>Primavera</option> <option>Verano</option> <option>Otono</option> <option>Invierno</option> </select> </form> </body> </Html> Esta estructura puede verse modificada principalmente a partir de otros dos atributos: size:Indica el nmero de valores mostrados de la lista. El resto pueden ser vistos por medio de la barra lateral de desplazamiento. Mltiple:Permite la seleccin de ms varios elementos de la lista. La eleccin de mas de un elemento se hace como con el explorador de Windows, a partir de las teclas ctrl o
Desarrollo web
33
Formularios
<form action="prueba1.htm" method="post"> <h1>Listas desplegables</h1> <select name="estacion" size="3" multiple> <option>Primavera</option> <option>Verano</option> <option>Otono</option> <option>Invierno</option> </select> </form> </body> </Html> Botones de radio Existe otra alternativa para plantear una eleccin, en este caso, obligamos al internauta a elegir nicamente una de las opciones que se le proponen. La etiqueta empleada en este caso es <input> en la cual tendremos el atributo type ha de tomar el valor radio. Veamos un ejemplo: <html> <head> <title>Formularios</title>
Desarrollo web
34
Formularios
Cajas de validacin Este tipo de elementos pueden ser activados o desactivados por el visitante por un simple clic sobre la caja en cuestin. La sintaxis utilizada es muy similar a las vistas anteriormente: <html> <head> <title>Formularios</title> </head> <body> <Form action="prueba1.htm" method="post">
Desarrollo web
35
Formularios
Envio, borrado y dems en formularios HTML Los formularios han de dar plaza no solamente a la informacin a tomar del usuario sino tambin a otra serie de funciones. Concretamente, han de permitirnos su envi mediante un botn. Tambin puede resultar practico poder proponer un botn de borrado o bien acompaarlo de datos ocultos que puedan ayudarnos en su procesamiento. En este capitulo, para terminar la saga de formularios, daremos a conocer los medios de instalar todas estas funciones. botn de envo Para dar por finalizado el proceso de relleno del formulario y hacerlo llegar a su gestor, el navegante ha de validarlo por medio de un botn previsto a tal efecto. La construccin de dicho botn no reviste ninguna dificultad una vez familiarizados con las etiquetas input ya vistas: <input type="submit" value="Enviar"> Como puede verse, tan solo hemos de especificar que se trata de un botn de envi (type="submit") y hemos de definir el mensaje del botn por medio del atributo value.
Desarrollo web
36
Formularios
Desarrollo web
37
Formularios
Desarrollo web
38
Formularios
Desarrollo web
39
Formularios
Desarrollo web
40
CSS
Introduccin Sintaxis Definicin de Hojas de Estilos Identificadores y las Clases Seleccion Contextual Especificacin de estilo Para Elementos Individuales Formato de Elemento de Bloque Pseudo Clase Selector Tablas en CSS
42 44 45 49 50 51 52 54 55
Desarrollo web
41
Desarrollo web
42
Desarrollo web
43
Sintaxis CSS
La sintaxis de compones de lo siguiente: -Etiqueta para definir el css: <style type="text/css"></style> -Llave: Aqui es donde definimos los estilos css { } -Selector: Puede ser cualquier etiqueta HTML o CSS h4 -Propiedad: Es el atributo del selector text-transform -Valor: Es le valor que le definimos a la propieda o atributo del selector uppercase. -----> Etiqueta de apertura css <style type="text/css"> selector---> h4 -->llave de apertura{propiedad--->text-transform: --->valor uppercase; color: blue;}0 selector--->blockquote -->llave de apertura{font-style: italic; color: red;} ----->Etiqueta de cierre</Style> La sintaxis bsica de una hoja de estilo se define por la apertura de la etiqueta <style type=text/css> y su cierre </style>. Aque existe 3 tipos de forma para dar utilizar el css las cuales mencionamos a continuacin: -Entre la cabezera HTML <head><style type=text/css> </style></head> utilizandolo de esta forma el programdor tiene que definir los estilos al principio. -Dentro de las etiquetas HTML ejemplo: <p style="color:#000000;"></p> -Utilizando una pagina externa con extension css escribiendo la direccin de la hoja de estilo en el cuerpo del encabezado <head></head> de la siguiente forma: <link rel="stylesheet" type="text/css" href="miEstilo.css" /> Durante la lectura iremos comprendiendo en que momento utilizamos las distintas forma de crear codigo css.
Desarrollo web
44
Desarrollo web
45
Si un documento incluye o se enlaza con una hoja de estilo, todos los estilos definidos en dicha hoja podrn utilizarse en cualquier punto del documento. Si la hoja de estilo especifica el estilo de una etiqueta HTML, entonces todas las etiquetas de ese tipo en el documento utilizarn dicho estilo. Puede haber casos en que interese aplicar un estilo selectivamente. Por ejemplo, se puede querer que los prrafos de un documento sean unas veces rojos y otras veces azules. En este caso definir un estilo que se aplique a todos los prrafos no ser la solucin correcta. Podemos obtener el efecto deseado definiendo una clase de estilo y especificando cuando queremos que sea utilizada. Para aplicar una clase de estilo a un elemento HTML, primero se debe definir la clase en la hoja de estilo, y despus se utilizar empleando el atributo class en cualquier elemento. <html> <head> <title>CSS</title>
Desarrollo web
46
Desarrollo web
47
Desarrollo web
48
Desarrollo web
49
Desarrollo web
50
Desarrollo web
51
Desarrollo web
52
Desarrollo web
53
Desarrollo web
54
Tablas en CSS
Las tablas como las dems etiquetas tambin se les puede aplicar estilo con el objeto de crear uniformidad y ahorranos tener que codificar cada vez que necesitemos una tablas con las misma especificaciones en el siguiente ejemplo podra ver que solo escribimos una vez el cdigo y como este se puede volver a utilizar para la etiqueta tabla. <html> <head> <title>CSS</title> <head> <style type="text/css"> table { width:auto; height:1px; table-layout:auto; border-collapse:collapse; margin-left:20px; border:1px solid black; } td, th { width:50px; height:1px; overflow:hidden; visibility:visible;
Desarrollo web
55
Para culminar con este apartado CSS. Ya que sabemos la sitanxis y las grandes prestaciones que nos brinda este lenguaje que practicamente ha llevado a mucho desarrolladores web emigrar todos sus sitios creados con HTML a CSS por ser un lenguaje que permite con poco codigo crear sitios de gran enbergadura. Finalizaremos con la presentacion de una pagina hecha con este tipo de codificacin en la cual abarcaremos todo lo visto hasta el momento. Para ver el resultado del siguiente codigo basta con solo copiar ese codigo al blog de nota y guardalo en formato HTML, luego habrimos la pagina en nuestro navegador, recomendablemente otro que no se ha IE. <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Pagina hecha en css</title> <style type="text/css"> body {
Desarrollo web
56
Desarrollo web
57
Desarrollo web
58
Desarrollo web
59
</body> </Html>
Actividad
-Analice el codigo y trate de encontrar la logica, apunte todo aquellos codigos que no logra entender e investiguelo. -Si lo investigado no lo deja claro proceda a consultar a su catedratico o catedratica. -Haga la siguiente modificaciones que se le indica a continuacin: 1.Cambiar el nombre del titulo y el color de fondo 2.Reemplace el contenido que se encuentra despues del encabezado 3.Reemplace el rectangulo que se encuentra despues del menu por una inmagen 4.Reemplace el contenido y cambie el tipo de letra que se encuentra despus del recuadro. -Trate al maximo de hacer imitar esta pagina pero solo con codificacin HTML sin utilizar el CSS.
Desarrollo web
60
VB.NET
Declaracin de variables Estructuras de Control Bucles y/o Ciclos Procedimientos y Funciones Clases en VB.Net
62 63 63 64 65
Desarrollo web
61
Declaracin de variables
La palabra reservada Dim permite declarar variables. Puede indicarse el tipo de dato de la variable incluyendo As [Type]. Tambin puede definirse valores de inicializacin para las variables recin declaradas. Dim x As Integer Dim s As String Dim s1, s2 As String Dim obj As New Object() Public name As String Dim s As String = "Hello World" Dim i As Integer = 1 Dim a() As Double = { 3.00, 4.00, 5.00 } Instrucciones: No se puede incluir ms de una instruccin por lnea. Acceso a Propiedadades Indexadas: En Visual Basic .Net, el acceso a propiedades indexadas se realiza indicando entre parntesis el nombre de la llave. Dim s, value As String s = Request.QueryString("Name") value = Request.Cookies("Key").Value Matrices: Generalmente, las matrices, deben ser definidas con un tamao fijo, antes de poder ser utilizadas. Pueden definirse matrices de varias dimensiones y solamente de un tipo. Dim a(2) As String
Desarrollo web
62
Estructuras de Control
Siempre se conserva la sintxis de Visual Basic para la definicin de estructuras de control. If Not (Request.QueryString = Nothing) Instrucciones End If Siempre he considerado que la estructura de control Switch en Visual Basic es muy diferente a las de lenguajes como C o Java. En especial por que su definicin no es Switch sino Select Case y por que no existe la instruccin Break: Select Case FirstName Case "John" Instrucciones Case "Paul" Instrucciones Case "Ringo" Instrucciones Case Else Instrucciones End Select
Desarrollo web
63
Procedimientos y Funciones
La programacin modular es beneficiosa, por que permite fragmentar un programa complejo en varios subprogramas, permitiendo al programador, centrarse en procedimientos que ejecutan instrucciones especficas. Visual Basic .Net, no escapa de
Desarrollo web
64
Clases en VB.Net
Siempre ser importante, la utilizacin de clases, que nos faciliten la tarea en asuntos rutinarios. Las clases permiten agrupar procedimientos y funciones comunes. Imports System Public Class ClassName Public Sub New() MyBase.New() End Sub
Desarrollo web
65
Public Sub Add(x As Integer) Me.x = Me.x + x Hace referencia a la propiedad X End Sub Public Function GetNum() As Integer Return x Tambien hace referencia a X End Function End Class End Namespace
Con estos finalizamos el repaso de VISUAL BASIC. Con el objeto de volverlos a familizarisar con el leguaje ya que para sacar provecho al lenguaje ASP.NET es de vital importancia conocer Visual Basic.
Desarrollo web
66
Desarrollo web
67
La plataforma .NET proporciona: Un modelo de programacin coherente e independiente del lenguaje para todas las capas o niveles de una aplicacin. -Una interoperabilidad transparente entre tecnologas. -Una fcil migracin desde tecnologas existentes. -Un completo soporte de tecnologas de Internet independientes de la plataforma y basadas en estndares, incluyendo Hypertext Transfer Protocol (HTTP), Extensible Markup Language (XML) y Simple Object Access Protocol (SOAP). La plataforma .NET es un conjunto de tecnologas diseadas para transformar Internet en una plataforma informtica distribuida a escala completa. Proporciona nuevas formas de desarrollar aplicaciones a partir de colecciones de Servicios Web. La plataforma .NET soporta totalmente la infraestructura existente de Internet, incluyendo HTTP, XML y SOAP.
.NET Framework
El .NET Framework se basa en un nuevo entorno de ejecucin de lenguaje comn (CLR - Common Language Runtime). Este motor de ejecucin proporciona un conjunto de servicios comunes para los proyectos generados en Visual Studio .NET, con independencia del lenguaje. Estos servicios proporcionan bloques de desarrollo
Desarrollo web
68
Common Language Runtime El CLR (Common Language Runtime) simplifica el desarrollo de aplicaciones, proporciona un entorno de ejecucin robusto y seguro, soporta mltiples lenguajes, simplifica la implantacin y administracin de aplicaciones y proporciona un entorno gestionado.
Desarrollo web
69
ADO.NET: Datos y XML Espacio de nombres System.Data El espacio de nombres System.Data est compuesto por clases que constituyen el modelo de objetos ADO.NET. A alto nivel, el modelo de objetos ADO.NET se divide en
Desarrollo web
70
Espacio de nombres
En el espacio de nombres System.Web, existen servicios como la gestin de cach, seguridad, configuracin y otros que son compartidos por los Servicios Web y por el interfaz de usuario (IU) Web. Espacio de nombres System.Web.Services El espacio de nombres System.Web.Services gestiona los requerimientos de los
Desarrollo web
71
Desarrollo web
72
ASP.NET 2.0
Introduccin ASP.NET Planear un Sitio web de ASP.NET Requisitos Instalacin de IIS Entorno desarrollador Visual Studio.NET Crear Formularios Web Forms con ASP.NET Uso de controles de Servidor Crear cdigo HTML especfico del navegador Tipos de controles de servidor Agregar cdigo a un formulario Web Form con Microsoft ASP.NET Qu son las pginas de cdigo subyacente? Uso de los eventos de pgina Acceso a datos con Microsoft ADO.NET Conexin a una base de datos Acceso a datos con DataSets. Utilizar un DataView Administracin del estado Tipos de administracin del estado El archivo Global.asax Variables de aplicacin y de sesin 74 76 82 82 85 86 90 91 92 104 105 109 114 116 119 122 124 125 127 129
Desarrollo web
73
ASP .NET
Que es ASP.NET?
ASP.NET es un marco de programacin basado en el .NET Framework que se utiliza para generar aplicaciones Web. Los formularios Web Forms ASP.NET, que forman parte de una aplicacin Web ASP.NET, proporcionan un modo fcil de generar sitios Web dinmicos. ASP.NET tambin incluye la tecnologa necesaria para generar servicios Web XML, que proporcionan los bloques bsicos para construir aplicaciones distribuidas basadas en la Web. Desarrollar aplicaciones Web ASP.NET sobre el .NET Framework es similar a desarrollar aplicaciones Windows. El componente fundamental de ASP.NET es el formulario Web Form. Un formulario Web Form es la pgina Web que los usuarios visualizan en un navegador. Una aplicacin Web ASP.NET consta de uno o ms formularios Web Form. Un Web Form es una pgina dinmica que puede acceder a recursos del servidor. Por ejemplo, una pgina Web tradicional puede ejecutar scripts en el cliente para realizar tareas bsicas. En cambio, un formulario Web Form ASP.NET tambin puede ejecutar cdigo en el lado servidor para acceder a una base de datos, generar formularios Web Forms adicionales, o aprovechar la seguridad incorporada en el servidor. Adems, como un formulario Web Form ASP.NET no depende de utilizar scripts en el cliente, no depende del tipo de navegador del cliente o del sistema operativo. Esta independencia permite desarrollar un nico formulario Web Form que puede ser visualizado prcticamente en todos los dispositivos que dispongan de acceso a Internet y de un navegador Web. Debido a que ASP.NET forma parte del .NET Framework, podemos desarrollar aplicaciones Web ASP.NET en cualquier lenguaje basado en .NET. Aplicacin Web ASP.NET Las partes de una aplicacin Web ASP.NET incluyen: -Formularios Web Forms o pginas .aspx Los formularios Web Forms y las pginas .aspx proporcionan la interfaz de usuario para la aplicacin Web. -Pginas con cdigo trasero Las pginas con cdigo trasero estn asociadas a los formularios Web Forms y contienen el cdigo del servidor
Desarrollo web
74
ASP .NET
para el formulario Web Form. -Archivos de configuracin Los archivos de configuracin son archivos XML que definen la configuracin predeterminada para la aplicacin Web y para el servidor Web. Cada aplicacin Web tiene un archivo de configuracin Web.config. Adems, cada servidor Web tiene un archivo machine.config. -Archivo Global.asax Los archivos Global.asax contienen el cdigo necesario para responder a los eventos a nivel de aplicacin provocados por ASP.NET. -Enlaces a servicios Web XML Los enlaces a servicios Web XML permiten a la aplicacin Web enviar y recibir datos de un servicio Web XML. -Conectividad a bases de datos La conectividad a bases de datos permite a la aplicacin Web transferir datos desde y hacia fuentes de base de datos. -Cach El uso de cach permite a la aplicacin Web devolver ms rpidamente formularios Web Forms y datos tras la primera peticin. Modelo de ejecucin de ASP.NET Cuando el cliente solicita una pgina Web por primera vez, se genera el siguiente conjunto de eventos: 1. El navegador cliente enva una solicitud GET HTTP al servidor. 2. El parseador ASP.NET interpreta el cdigo fuente. 3. Si el cdigo no se ha compilado todava en una biblioteca de enlace dinmico (DLL), ASP.NET invoca el compilador. 4. El CLR carga y ejecuta el cdigo Microsoft intermediate language (MSIL).
Desarrollo web
75
ASP .NET
Cuando el usuario invoca la misma pgina Web por segunda vez, se genera el siguiente conjunto de eventos: 1. El navegador cliente enva una solicitud GET HTTP al servidor. 2. El CLR carga y ejecuta inmediatamente el cdigo MSIL que ya se ha compilado durante el primer intento de acceso del usuario.
Desarrollo web
76
ASP .NET
Tener acceso a datos de un almacn de datos El enlace de datos de ASP.NET permite enlazar componentes con orgenes de datos y con propiedades, colecciones, expresiones y mtodos simples. Esto proporciona mayor flexibilidad a la hora de utilizar datos de una base de datos u otros orgenes. Si el sitio web tiene acceso a un almacn de datos, debe plantearse la utilizacin de controles de origen de datos, ya que forman parte de un modelo de datos comn. Este modelo de datos separa el cdigo de acceso a datos y el cdigo de lgica empresarial de las pginas web que forman la capa de presentacin del sitio web. Una capa de acceso a datos consta de mtodos que se utilizan para tener acceso a un almacn de datos. Una capa de lgica empresarial agrega reglas a la capa de acceso a datos, como la restriccin del acceso para ver o cambiar los datos. La capa de presentacin consta de pginas a las que tienen acceso los usuarios para ver y modificar los datos. Tambin debe considerar si el sitio web debe utilizar datos en memoria (almacenados en memoria cach). Si una parte significativa de los datos de aplicacin no cambia con frecuencia y es comn entre diferentes sesiones o usuarios, puede mantener los datos en memoria en el servidor web. De esta forma puede reducir el nmero de solicitudes a la base de datos y acelerar las interacciones del usuario. Para crear una base de datos en memoria, se usa la clase DataSet. Otro aspecto til del objeto DataSet es que permite a una aplicacin introducir subconjuntos de datos de uno o ms orgenes de datos en el espacio de la aplicacin. Navegacin en sitios Cuando un sitio crece y cuando se mueven sus pginas, rpidamente puede hacerse complicado administrar todos los vnculos. La navegacin del sitio de ASP.NET consta de clases y controles de servidor que permiten proporcionar a los usuarios una manera coherente de navegar en el sitio. Puede almacenar los vnculos a todas las pginas en una ubicacin central (normalmente un archivo XML). Puede representar esos vnculos en listas o mens de navegacin en cada pgina incluyendo un control SiteMapDataSource para leer informacin del sitio.Una parte clave de la navegacin del sitio de ASP.NET es el proveedor del mapa del sitio. sta es una clase que se utiliza con un origen de datos del mapa del sitio y expone la informacin de navegacin. Por ejemplo, el proveedor del mapa del sitio de ASP.NET obtiene los datos de mapa del sitio de un archivo XML que se denomina Web.sitemap y comunica estos datos directamente al control de servidor web SiteMapPath. Definir una apariencia homognea del sitio web Varias caractersticas de ASP.NET ayudan a crear y mantener un aspecto y un diseo homogneos del sitio web, como los temas de ASP.NET y las pginas maestras de ASP.NET. Estas caractersticas se pueden utilizar en las primeras fases del proceso de desarrollo para proporcionar un aspecto homogneo del sitio web.
Desarrollo web
77
ASP .NET
Los temas de ASP.NET definen el aspecto de pginas y controles en el sitio web. Un tema de ASP.NET puede incluir archivos de mscara, que definen valores de propiedad para los controles de servidor web de ASP.NET. Tambin puede incluir archivos de hoja de estilos en cascada (archivos .css) y grficos. Cuando aplica un tema, puede dar a las pginas del sitio web un aspecto ms uniforme. Al crear un tema o un conjunto de temas para un sitio en las primeras fases del proceso de desarrollo, puede aplicar estos temas a cada nueva pgina que crea. Las pginas maestras de ASP.NET permiten crear un diseo de pgina (una pgina maestra) que se puede aplicar en pginas seleccionadas (pginas de contenido) del sitio web. Las pginas maestras pueden simplificar en gran medida la tarea de crear un aspecto coherente para el sitio. Tambin se pueden anidar pginas principales. Por ejemplo, puede utilizar pginas maestras anidadas para crear un diseo maestro del sitio completo y otro diseo maestro para secciones individuales de un sitio. Tambin puede utilizar pginas maestras con temas. . Utilizar caractersticas de administracin de estados HTTP es un protocolo sin estado. Cada solicitud se atiende a medida que se recibe y, una vez procesada, los datos se descartan. Los estados no se mantienen entre las diferentes solicitudes, aunque procedan del mismo cliente. Sin embargo, en la mayora de las aplicaciones web, resulta til mantener el estado entre las distintas solicitudes. ASP.NET proporciona funcionalidad de administracin de estado intrnseca que permite almacenar informacin entre las solicitudes de pgina, como la informacin de clientes o el contenido del carro de la compra. Puede guardar y administrar informacin especfica de la aplicacin, especfica de la sesin, especfica de la pgina, especfica del usuario y definida por el desarrollador. ASP.NET dispone de varios mtodos de administracin de estados que se pueden seleccionar, entre los que se incluyen la utilizacin de cookies, el estado de vista, el estado de sesin, el estado de aplicacin y las propiedades de perfil. Esta informacin puede ser independiente de cualquier control de la pgina, Al planear un sitio web, debe considerar qu mtodos de administracin de estados necesitar. Almacenar datos en memoria cach para aumentar el rendimiento A menudo, puede aumentar el rendimiento de un sitio web si almacena en memoria los datos a los que se tiene acceso con ms frecuencia y cuya creacin requiere un tiempo de procesamiento significativo. Por ejemplo, si la aplicacin procesa grandes cantidades de datos utilizando una lgica compleja y, a continuacin, los devuelve en un formato de informe, resulta eficiente evitar la creacin de dicho informe cada vez que un usuario lo solicita. De manera similar, si la aplicacin incluye una pgina que procesa datos complejos pero que no se actualiza frecuentemente, no resulta eficiente que el servidor vuelva a crear dicha pgina en cada solicitud. La cach de ASP.NET es una utilidad de la memoria cach de uso general para los sitios web. Proporciona una interfaz simple para almacenar en memoria cach y una interfaz
Desarrollo web
78
ASP .NET
ms avanzada que expone servicios de expiracin y de dependencia de cambios. Para ayudarle a aumentar el rendimiento de la aplicacin en estas situaciones, ASP.NET proporciona dos mecanismos de almacenamiento en cach. El primero es el almacenamiento en cach de aplicaciones, que permite almacenar en cach los datos que se generan, como un objeto DataSet o un objeto de negocios de informe personalizado. El segundo es el almacenamiento en cach de los resultados de las pginas, que permite guardar los resultados del procesamiento de pginas y reutilizarlo, en lugar de volver a procesar la pgina cada vez que un usuario la solicite de nuevo. Si el diseo del sitio web tiene en cuenta el almacenamiento en cach de pginas determinadas, puede crear un sitio web ms eficaz. Infraestructura de seguridad -Adems de las caractersticas de seguridad de .NET Framework, ASP.NET proporciona una infraestructura de seguridad para autenticar y autorizar el acceso de los usuarios, as como para realizar otras tareas relacionadas con la seguridad. Puede autenticar los usuarios mediante la autenticacin de Windows que proporciona IIS. Tambin puede administrar la autenticacin mediante la autenticacin de formularios de ASP.NET y la pertenencia de ASP.NET. Adems, puede administrar la autorizacin para el acceso a los recursos de la aplicacin web mediante grupos de Windows o bien mediante el uso de una base de datos de funciones personalizada y las funciones de ASP.NET. Resulta fcil quitar, agregar o reemplazar estos esquemas dependiendo de las necesidades de la aplicacin. ASP.NET siempre se ejecuta con una identidad particular de Windows de modo que puede asegurar su aplicacin utilizando capacidades de Windows como las listas de control de acceso (ACL) del sistema de archivos NTFS y los permisos de la base de datos. Otras consideraciones Antes de codificar un sitio web, tambin debe tener en cuenta los temas de esta seccin. Si incorpora la informacin de estos temas en la planeacin, puede ahorrar tiempo y conseguir un sitio conforme a las normas actuales de web. Accesibilidad La programacin de accesibilidad es el proceso que se encarga de disear y desarrollar aplicaciones que funcionen con el sistema operativo de un equipo para adaptarse a deficiencias especficas, como por ejemplo, una limitacin de movimiento o problemas de visin. ASP.NET puede ayudarle a crear aplicaciones Web con un acceso ms fcil para personas con discapacidades. Las aplicaciones Web accesibles permiten utilizar tecnologas de ayuda, como lectores de pantalla, para trabajar con pginas Web. Las aplicaciones Web accesibles ofrecen las ventajas siguientes:
Desarrollo web
79
ASP .NET
-Pueden utilizarlas un mayor nmero de personas. -Implican principios de diseo que con frecuencia benefician a todos los usuarios, no slo a los que tienen discapacidades. -Cumplen los requisitos de muchas instituciones en el sentido de que todas las aplicaciones Web sean accesibles. El conocimiento de los consejos para la accesibilidad y de cmo puede ayudarle ASP.NET a seguirlos le permitirn crear aplicaciones con las que las personas que tienen discapacidades tendrn la posibilidad de interaccionar con mayor facilidad. En la mayora de las ocasiones, los controles ASP.NET representan marcado que crea pginas que cumplen las normas de accesibilidad. Tambin pueden exponer propiedades que puede establecer de forma que la pgina cumpla los criterios de accesibilidad. Sin embargo, hay veces en que los controles ASP.NET representan resultados que no cumplen con los estndares de accesibilidad. Globalizacin y localizacin La globalizacin es el proceso mediante el cual se disean y desarrollan aplicaciones que pueden funcionar con diversas referencias culturales. Localizacin es el proceso mediante el cual se personaliza una aplicacin para una referencia cultural y configuracin regional determinadas. Si crea pginas web que leern personas que hablan idiomas diferentes, debe permitir que los lectores vean las pginas en su propio idioma. ASP.NET permite crear una pgina que puede obtener contenido y otros datos basndose en la configuracin de idioma preferido del explorador o en la eleccin explcita del idioma por parte del usuario. Este contenido y otros datos se denominan recursos; los datos de este tipo se pueden almacenar en archivos de recursos o en otros orgenes. En la pgina Web ASP.NET, configure controles para obtener los valores de sus propiedades de los recursos. En tiempo de ejecucin, las expresiones de recursos se reemplazan con recursos del archivo de recursos adecuado. Generar pginas individuales y precompilar La generacin de una pgina o de un sitio Web forma parte del desarrollo de un sitio, y una de sus finalidades es ayudar a encontrar los errores en tiempo de compilacin que pueden producirse en cualquier parte del sitio. Aunque el proceso de compilacin compila las pginas, no genera un ensamblado que se pueda implementar. Se puede implementar un sitio sin compilarlo copiando todos los archivos del sitio web en un servidor de produccin. Cuando los usuarios solicitan pginas del servidor de produccin, ASP.NET compila dinmicamente el sitio, realizando de hecho los mismos pasos que el proceso de compilacin realiza en Visual Studio. ASP.NET almacena en cach los resultados que se obtienen para que las pginas no se tengan que volver a compilar con cada solicitud. Si desea compilar el sitio en ensamblados y otros archivos que se puedan implementar, puede publicar el sitio. El proceso de publicacin realiza los mismos pasos de compilacin que el proceso de generacin, pero guarda los resultados en una carpeta y
Desarrollo web
80
ASP .NET
en subcarpetas que, a su vez, se pueden implementar en el servidor de produccin.
Desarrollo web
81
ASP .NET
Requisitos previo a la continuacin de esta lectura
El alumno y el catedrtico debe contar con lo siguiente: -Procesador Pentium 4 o superiores -Memoria mnima 256 MG -Sistema operativo Windows XP Service Pack 2.0 -Microsoft Visual Estudio 2005 o 2003 -Servidor ISS para correr localmente nuestra pagina
Nota: Por lo general al instalar Microsoft Visual Estudio.Net no es necesario instalar el servidor ISS pero siempre es necesario, si queremos correr nuestra aplicacin fuera del entorno desarrollador Net. Ademas el Net.Framewok se instala con Microsoft Visual Estudio 2005 o 2003
Instalacin de IIS
Instalacin desde el CD de Windows Insertamos el CD, y vamos a Instalacin de Componentes Opcionales de Windows o bien .. Instalacin desde el Panel de Control Vamos al Panel de Control (con Inicio, Configuracin, Panel de Control, o Mi PC, Panel de Control)
Desarrollo web
82
ASP .NET
En la ventana de Componentes Adicionales de Windows, debemos elegir Servicios de Internet Information Server, y le damos en Detalle.
Fuimos a Detalle, para asegurarnos de marcar todos los elementos, de forma que no tengamos inconvenientes de faltantes cuando avancemos con ASP y/o ASP.NET
Desarrollo web
83
ASP .NET
Finalmente, salimos con Aceptar de la ventana de Servicios de IIS, y nuevamente Aceptar en la ventana de Componentes de Windows, y cerramos el Panel de Control Con estos sencillos pasos estara listo nuestro Servidor Local de Paginas Web's, soportando ASP y ASP.NET En nuestro disco duro, la carpeta por defecto sera c:\inetpub\wwwroot que equivale a Http://localhost Hagamos ahora nuestro primer y sencillo ASP para comprobar el funcionamiento de nuestro Servidor Web Local: -Vamos a Inicio -Ejecutar -escribimos notepad c:\inetpub\wwwroot\index.asp -le diremos que queremos crear un archivo (ya que no existe) y adentro escribimos <% Response.Write("Nuestro Primer ASP.net") %> -Y cerramos el Block de Notas, guardando el archivo -Luego lo abrimos
Desarrollo web
84
ASP .NET
Entorno desarrollador Visual Studio.NET
Pestaas aspx, aspx.vb Menu
Explorador de Soluciones
Caja de Herramientas
Escenario
Propiedades
Sobre este escenario trabajremos durante este periodo. El entorno desarrollador cuenta con una serie de panales pero lo mas usados son los que estn viendo en la imagen superior. Los dems panales los pueden ver solo basta con entrar a la aplicacin y darse un vistazo para ambientarse a este entorno.
Desarrollo web
85
ASP .NET
Crear formularios Web Forms con ASP.NET
Estudiaremos cmo crear y poblar formularios Web Forms. Los formularios Web Forms son pginas Web programables que sirven como interfaz de usuario (IU) para un proyecto de aplicacin Web utilizando ASP.NET. Un formulario Web Form presenta informacin al usuario visualizable en cualquier tipo de navegador, e implementa lgica de aplicacin utilizando cdigo ejecutable en el servidor Los formularios Web Forms estn formados por una combinacin de HTML, cdigo y controles que se ejecutan en un servidor Web ejecutando Microsoft Internet Information Services (IIS). Los formularios Web Forms muestran una interfaz de usuario que genera HTML y que se enva al navegador, mientras que el cdigo de soporte y los controles que la componen permanecen en el servidor Web. Esta divisin entre el interfaz en el cliente y el cdigo en el servidor es una importante diferencia entre los formularios Web Forms y las pginas Web tradicionales. Mientras una pgina Web tradicional requiere que todo el cdigo se enve y se procese en el navegador, los formularios Web Forms nicamente necesitan enviar al navegador los controles de la interfaz, y el proceso de las pginas se mantiene en el servidor. Esta divisin entre IU y cdigo aumenta el nmero de navegadores soportados e incrementa la seguridad y funcionalidad de la pgina Web. Extensin .aspx -Atributos de pgina -Directiva @ Page -Atributos de cuerpo -Atributos de formulario <%@ Page Language="vb" Codebehind="WebForm1.aspx.vb" SmartNavigation="true"%> <html> <body ms_positioning="GridLayout"> <form id="Form1" method="post" runat="server"> </form> </Body> Extensin .aspx Los formularios Web Forms se denominan habitualmente pginas ASP.NET o pginas ASPX. Los formularios Web Forms tienen una extensin .aspx y funcionan como contenedores para el texto y los controles que deseamos mostrar en el navegador.
Desarrollo web
86
ASP .NET
Atributos de la pgina Las funciones de un formulario Web Form estn definidas por tres niveles de atributos. Los atributos de pgina definen las funciones globales, los atributos de cuerpo definen cmo se mostrar una pgina y los atributos de formulario definen cmo se procesarn los grupos de controles. La etiqueta <@Page> define atributos especficos de la pgina que utiliza el parseador de pginas ASP.NET y el compilador. nicamente podemos incluir una etiqueta <@ Page> por archivo .aspx. Los siguientes ejemplos son etiquetas <@ Page> tpicas para Microsoft Visual Basic .NET y para Microsoft Visual C# .NET: Visual Basic .NET <%@ Page Language="vb" Codebehind="WebForm1.aspx.vb" SmartNavigation="true" %> Los atributos de una etiqueta <@ Page> incluyen: -Language El atributo Language define el lenguaje en el que est escrito el script de la pgina Web. Algunos de los valores de este atributo son: vb, c# y Jscript. -Pgina Codebehind El atributo de pgina Codebehind identifica la pgina de cdigo subyacente que tiene la lgica que soporta el formulario Web Form. Cuando Visual Studio .NET crea un formulario Web Form, como WebForm1.aspx, tambin crea una pgina de cdigo subyacente, WebForm1.aspx.vb o WebForm1.aspx.cs. -SmartNavigation El atributo SmartNavigation de ASP.NET permite al navegador actualizar nicamente las secciones del formulario que han cambiado. Las ventajas de SmartNavigation son que la pantalla no parpadea mientras se actualiza; en lugar de ello, se mantiene la posicin de desplazamiento y se mantiene la "ltima pgina" en el historial. Smartnavigation nicamente est disponible para los usuarios con Microsoft Internet Explorer 5 o superior. Atributos del cuerpo Los atributos de la etiqueta <Body> definen el aspecto de los objetos que se muestran en el navegador del cliente. La siguiente es una etiqueta <Body> Tpica: <body ms_positioning="GridLayout"> Los atributos de una etiqueta <Body> incluyen:
Desarrollo web
87
ASP .NET
-PageLayout El atributo pageLayout (etiquetado como ms_positioning) determina cmo se posicionan los controles y el texto en la pgina. Existen dos opciones para pageLayout: FlowLayout En FlowLayout, el texto, las imgenes y los controles fluyen por la pantalla, dependiendo del ancho de la ventana del navegador. GridLayout En GridLayout, los campos de texto, las imgenes y los controles de una pgina estn fijados por coordinadas absolutas. GridLayout es el valor de pageLayout predeterminado para Visual Studio .NET. El siguiente cdigo de ejemplo muestra cmo implementar GridLayout y situar un cuadro de texto: <body ms_positioning="GridLayout"> <form id="Form1" method="post" runat="server"> <asp:textbox id="txtField1" style="Z-INDEX: 101; LEFT: 65px; POSITION: absolute; TOP: 98px" runat="server" Height="26px" Width="194px"> </asp:textbox> </form> </Body> Atributos del formulario La etiqueta <Form> define cmo se procesarn los grupos de controles. La etiqueta <Form> es diferente del trmino Web Form utilizado para definir la pgina Web completa. Los atributos de la etiqueta <Form> definen cmo se procesarn los controles. Aunque podemos tener muchos formularios HTML en una pgina, nicamente podemos tener un formulario del lado del servidor en una pgina .aspx. El siguiente ejemplo es de una etiqueta <Form> tpica: <form id="Form1" method="post" runat="server"> ... </Form> Los atributos de una etiqueta <Form> incluyen: -Method El atributo Method identifica el mtodo para enviar valores de control de retorno al servidor. Las opciones de este atributo son: Post Los datos se pasan en pares nombre/valor dentro del cuerpo de la
Desarrollo web
88
ASP .NET
peticin HTTP (Hypertext Transfer Protocol). Get Los datos se pasan en una cadena de consulta. -Runat Una de las principales caractersticas de un formulario Web Form es que los controles se ejecutan en el servidor. El atributo runat="server" hace que el formulario publique informacin de control de retorno a la pgina ASP.NET en el servidor donde se ejecuta el cdigo de soporte. Si el atributo runat no est establecido en "server", el formulario funciona como un formulario HTML normal. Ejemplo con Visual Basic .NET <%@Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <Title>WebForm1</title> <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.1"> <meta name="CODE_LANGUAGE" content="Visual Basic 7.1"> <meta name="vs_defaultClientScript" content="JavaScript"> <meta name="vs_targetSchema" Content="http://schemas.microsoft.com/intellisense/ie5"> </head> <body MS_POSITIONING="GridLayout"> <form id="Form1" method="post" runat="server"> ' HTML y controles aqu </Form> </body> </Html> Aplicaciones Web nuevas Cuando creamos un nuevo proyecto en Visual Studio .NET, se incluye automticamente en el proyecto un formulario Web Form predeterminado denominado WebForm1.aspx. Crear un nuevo proyecto de aplicacin Web ASP.NET y un formulario Web Form predeterminado 1. En Visual Studio .NET, en la Pgina de inicio, hacer clic en Nuevo proyecto.
Desarrollo web
89
ASP .NET
2. En el cuadro de dilogo Nuevo proyecto, hacer clic en Aplicacin Web ASP.NET, escribir el nombre del proyecto en el campo Ubicacin y hacer clic en Aceptar. Visual Studio .NET crea una nueva aplicacin Web y un formulario Web Form predeterminado denominado WebForm1.aspx. Crear formularios Web Forms adicionales Si estamos expandiendo un proyecto existente, podemos utilizar el Explorador de soluciones para agregar rpidamente formularios Web Forms adicionales. - Agregar formularios Web Forms adicionales a un proyecto de aplicacin Web 1. En la ventana del Explorador de soluciones, hacer clic con el botn derecho en el nombre del proyecto, seleccionar Agregar, y hacer clic en Agregar formulario Web Form. Se abrir el cuadro de dilogo Agregar nuevo elemento - NombreProyecto. 2. En el cuadro de dilogo Agregar nuevo elemento - NombreProyecto,cambiar el nombre del formulario Web Form, y hacer clic en Abrir. Se crear un nuevo formulario Web Form y se agregar al proyecto.
Desarrollo web
90
ASP .NET
Funcionalidad incluida La funcionalidad de un control es lo que se produce cuando el usuario hace clic en un botn o en un cuadro de lista. A estos procesos se denominan procedimientos de eventos. Como programadores del formulario Web Form, debemos determinar los procedimientos de eventos asociados a cada control de servidor. Modelo de objetos comn En ASP.NET, los controles de servidor se basan en un modelo de objetos comn, y por tanto, comparten varios atributos entre s. Por ejemplo, cuando deseamos establecer el color de fondo de un control, siempre utilizamos el mismo atributo BackColor, independientemente del control. El cdigo HTML siguiente del botn de un control de servidor Web muestra algunos de los atributos tpicos de un control de servidor:
Desarrollo web
91
ASP .NET
Tipos de controles de servidor
Existen numerosos tipos de controles de servidor disponibles en ASP.NET. Algunos controles de servidor se parecen mucho a los controles HTML tradicionales, mientras que otros son nuevos en ASP.NET. Esta amplia variedad de controles nos permite personalizar nuestro formulario Web Form para que se adapte a la aplicacin que estamos creando. Por defecto, el servidor no tiene disponibles los elementos HTML de una pgina de un formulario Web Form; los elementos HTML son tratados como texto opaco que pasa a travs del navegador. Sin embargo, al agregar el atributo runat="server" se convierten los elementos HTML en controles de servidor HTML, exponindolos por tanto como elementos que podemos programar con cdigo del lado del servidor. Controles de servidor Web Los controles de servidor Web no slo incluyen controles de tipo formulario, como botones y cuadros de texto, sino tambin controles con funcionalidad especial, como el control calendario. Los controles de servidor Web son ms abstractos que los controles de servidor HTML, porque su modelo de objetos no refleja necesariamente la sintaxis HTML. Los controles de servidor Web se clasifican como: -Controles intrnsecos Los controles intrnsecos concuerdan con los sencillos elementos HTML, como botones o cajas de listas. Utilizamos estos controles del mismo modo que utilizamos los controles de servidor HTML. -Controles de validacin Los controles de validacin incorporan lgica que permite verificar la entrada de datos de un usuario. Para probar la entrada de un usuario, adjuntamos un control de validacin al control de entrada y especificamos las condiciones de entrada de datos de usuario correctas. Mdulo Validar la entrada de datos de usuario. -Controles ricos estndar Los controles estndar son controles complejos que incluyen mltiples funciones. Ejemplos de controles estndar incluyen el control AdRotator, que se utiliza para mostrar una secuencia de anuncios o el control Calendar, que proporciona un calendario de citas. -Controles enlazados a listas Los controles enlazados a listas pueden mostrar listas de datos en una pgina ASP.NET. Estos controles nos permiten mostrar, reformatear, clasificar y editar datos.
Desarrollo web
92
ASP .NET
Ejemplo de controles equivalentes Este ejemplo muestra el cdigo HTML de tres controles de tipo botn: un botn HTML, un botn de control de servidor HTML y un botn de control de servidor Web. Todos los controles botn parecen idnticos en el navegador del usuario. El botn HTML nicamente puede invocar eventos del lado del cliente, mientras que el botn de control de servidor HTML y el botn de control de servidor Web producen eventos del lado del servidor. -El siguiente es el cdigo de un control de botn HTML: <INPUT type="button" value="HTML Button"> -Si agregamos el atributo runat="server" el control de botn HTML anterior se convierte en un control de servidor HTML que se ejecutar en el servidor. Adems del atributo runat="server", tambin debemos agregar un atributo id para que el control funcione como un control de servidor. El botn de control de servidor HTML se muestra en el siguiente ejemplo: <INPUT type="button" value="HTML Server Control" id="button1" runat="server"> -El botn de control de servidor Web utiliza cdigo HTML de ASP.NET: <asp:Button id="Button1" runat="server" Text="Web control"/> Guardar el estado de la vista Uno de los retos de los sitios Web es resolver el almacenamiento del estado de los controles (configuracin o entrada de datos del usuario) en una pgina Web mientras el cdigo HTML viaja entre el cliente y el servidor. Como con cualquier tecnologa basada en HTTP, los formularios Web Forms no tienen estado, lo que significa que el servidor no conserva ninguna informacin sobre las peticiones anteriores del cliente. Los formularios Web Forms ASP.NET gestionan este problema de almacenamiento del estado del control de servidor Web agregando un control oculto denominado _VIEWSTATE que registra el estado de los controles en el formulario Web Form. Concretamente, _VIEWSTATE se aade al formulario del lado del servidor indicado por la etiqueta <Form runat="server">, y nicamente registra el estado de los controles en esta seccin. Mientras la pgina viaja desde el cliente al servidor, el estado del control de servidor Web se almacena con la pgina y puede actualizarse en cualquier extremo de la transaccin (en el cliente o el servidor). Como el estado de la pgina Web se guarda dentro del formulario del servidor, la pgina Web puede ser aleatoriamente enrutada en una granja de servidores Web y no necesita volver al mismo servidor. La ventaja del proceso _VIEWSTATE es que el programador puede concentrarse en el diseo de la pgina y no necesita generar la
Desarrollo web
93
ASP .NET
infraestructura necesaria para realizar el seguimiento del estado de la misma. Control Oculto El control _VIEWSTATE es un control oculto que contiene el valor de una cadena de pares nombre-valor que lista el nombre de cada control y el ltimo valor de ese control. Con cada peticin, el control _VIEWSTATE se actualiza y se enva al servidor. La respuesta del servidor puede a su vez actualizar el control _VIEWSTATE, que se devuelve con la respuesta. El resultado es que la configuracin de la pgina permanece coherente de una solicitud a la siguiente. El siguiente ejemplo incluye el cdigo HTML generado por un formulario Web Form y enviado al cliente: <form name="Form1" method="post" action="WebForm1.aspx" id="Form1"> <input type="hidden" name="__VIEWSTATE" value="dDw3NzE0MTExODQ7Oz4=" /> 'HTML aqu </Form> Deshabilitar y habilitar ViewState De forma predeterminada, un formulario Web Form guarda el estado de la vista de los controles en el formulario Web Form. Para formularios Web Forms con mltiples controles, el tamao del campo valor de las propiedades _VIEWSTATE puede ralentizar el rendimiento. Para maximizar el rendimiento de la pgina, podemos deshabilitar el atributo ViewState a nivel de pgina y habilitar ViewState nicamente para determinados controles. Para deshabilitar el almacenamiento del estado de la vista a nivel de pgina Web, estableceremos el atributo EnableViewState de la directiva @Page, como se muestra en el siguiente cdigo: <%@ Page EnableViewState="False" %> Para habilitar el almacenamiento del estado de la vista de un control especfico,estableceremos el atributo EnableViewState del control, como se muestra en el siguiente cdigo: <asp:ListBox id="ListName" EnableViewState="true" Runat="server"></asp:ListBox> Controles de servidor Web Los controles de servidor Web se basan en un modelo de objetos comn; por ello, todos los controles comparten varios atributos, incluyendo la etiqueta <asp:TipoControl...>, y un atributo id. Los controles de servidor Web existen en el espacio de nombres System.Web.UI.WebControls y pueden utilizarse en cualquier formulario Web Form.
Desarrollo web
94
ASP .NET
Controles de servidor Web intrnsecos
Control de servidor Web <Asp:button> <Asp:checkbox> Control HTML equivalente <input type=submit> <input type=checkbox> Funcin del control de servidor Web Crea un botn que enva una peticin al servidor. Crea una casilla de verificacin que puede seleccionarse haciendo clic. Crea un hiperenlace a una etiqueta anchor HTML. Crea un rea que se utiliza para Mostrar una imagen. Crea un botn que incorpora la visualizacin de una imagen en lugar de texto. Crea un botn que tiene el Aspecto de un hiperenlace. Crea texto que los usuarios no pueden modificar. Crea una lista de opciones. Permite mltiples selecciones. Crea una divisin sin bordes en el formulario que se utiliza como contenedor para otros controles. Crea un nico control de botn de Opcin. Crea una tabla. Crea un control de cuadro de texto.
Los controles de validacin son controles ocultos que validan la entrada de datos del usuario comparndolos con patrones predeterminados. La siguiente tabla muestra algunos de los controles de validacin que se utilizan ms habitualmente. Control CompareValidator CustomValidator Funcin Requiere que la entrada concuerde con una segunda entrada o campo existente. Requiere que la entrada concuerde con una condicin como que sean nmeros primos o
Desarrollo web
95
ASP .NET
RangeValidator Requiere que la entrada concuerde con un intervalo especificado. Requiere que la entrada concuerde con un formato especificado como un nmero de telfono de un determinado pas o una contrasea que tenga nmeros y letras. Requiere que el usuario introduzca algn valor antes de que el control sea procesado. Recopila todos los mensajes de error de los controles de validacin para una visualizacin centralizada.
RegularExpressionValidator
RequiredFieldValidator ValidationSummary
Controles ricos estndares Los controles estndares proporcionan una rica funcionalidad a nuestro formulario Web Form insertando funciones complejas. La siguiente tabla muestra los controles ricos disponibles actualmente.. Contro AdRotator lFuncin Muestra una secuencia (predefinida o aleatoria) de imgenes. Muestra un calendario grfico en el que los usuarios pueden seleccionar fechas.
Calendar
Controles enlazados a listas Los controles enlazados a listas pueden mostrar datos desde una fuente de datos. La siguiente tabla muestra algunos de los controles de lista que se utilizan habitualmente. Control CheckBoxList Repeater Funcin Muestra datos como una columna de casillas de verificacin. Muestra informacin desde un conjunto de datos utilizando el conjunto de elementos y controles HTML que especifiquemos. El control Repeater repite el elemento una vez por cada registro del DataSet.
Desarrollo web
96
ASP .NET
DataList Similar al control Repeater, pero con ms opciones de formato y presentacin, incluyendo la posibilidad de mostrar informacin en una tabla. El control DataList tambin nos permite especificar el comportamiento de edicin. Muestra informacin, normalmente enlazada a datos en forma tabular, con columnas. Tambin proporciona mecanismos para permitir editar y clasificar. Muestra datos en un men desplegable. Muestra datos en una ventana. Muestra datos en una columna de botones de Opcin.
DataGrid
Actividad:
Identificar el cdigo HTML generado por los controles de servidor Web En esta actividad, agregaremos controles de servidor Web a un formulario Web Form y visualizaremos el cdigo fuente en un navegador para determinar qu cdigo HTML se ha enviado al cliente. 1. Iniciar Visual Studio .NET. 2. Crear un proyecto de aplicacin Web y establecer la ubicacin en http://localhost/Practices03. 3. Abrir la pgina WebForm1.aspx. 4. Agregar los controles TextBox, Button, Label, ListBox, Image, Hyperlink y Calendar al formulario Web Form. 5. Hacer clic con el botn derecho en WebForm1.aspx en el Explorador de soluciones y clic en Generar y examinar. 6. Hacer clic con el botn derecho en el navegador y clic en Ver fuente para ver el cdigo HTML enviado al cliente. 7. Cumplimentar la siguiente tabla con las etiquetas HTML del control. Ingrese los siguientes controles asp:textbox asp:button Asp:label asp:listbox asp:image asp:hyperlink asp:calendar
Desarrollo web
97
ASP .NET
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <asp:Label ID="Label1" runat="server" Font-Size="Large" Height="25px" Style="z-index: 100; left: 192px; position: absolute; top: 36px" Text="Fomulario de Prueba" Width="178px"></asp:Label> <asp:TextBox ID="TextBox1" runat="server" Style="z-index: 101; left: 189px; position: absolute; top: 82px" Width="300px"></asp:TextBox> <asp:Button ID="Button1" runat="server" Style="z-index: 102; left: 342px; position: absolute; top: 121px" Text="Aceptar" Width="104px" /> <asp:ListBox ID="ListBox1" runat="server" DataMember="Ever, Dos" Style="z-index: 103; left: 191px; position: absolute; top: 114px"> <asp:ListItem>Honduras</asp:ListItem> <asp:ListItem Selected="True">Salvador</asp:ListItem> <asp:ListItem>Costa Rica</asp:ListItem> <asp:ListItem>Nicaragua</asp:ListItem> <asp:ListItem></asp:ListItem> </Asp:ListBox> <asp:Image ID="Image1" runat="server" Height="102px" ImageUrl="C:\Documents and Settings\Administrator\My Documents\Visual Studio 2005\WebSites\libro\Image0003.JPG" Style="z-index: 104; left: 193px; position: absolute; top: 202px" Width="137px" /> <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="htt://www.fragua.org" Style="z-index: 105; left: 196px; position: absolute; top: 307px">Mi Pais</asp:HyperLink> <asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="Black" DayNameFormat="Shortest" Font-Names="Times New Roman" Font-Size="10pt" ForeColor="Black" Height="124px" NextPrevFormat="FullMonth" Style="z-index: 107; left: 365px; position: absolute; top: 165px" TitleFormat="Month" VisibleDate="2008-06-13" Width="260px"> <SelectedDayStyle BackColor="#CC3333" ForeColor="White" /> <TodayDayStyle BackColor="#CCCC99" /> <SelectorStyle BackColor="#CCCCCC" Font-Bold="True" Font-Names="Verdana" Font-Size="8pt" ForeColor="#333333" Width="1%" /> <DayStyle Width="14%" /> <OtherMonthDayStyle ForeColor="#999999" /> <NextPrevStyle Font-Size="8pt" ForeColor="White" /> <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" ForeColor="#333333" Height="10pt" /> <TitleStyle BackColor="Black" Font-Bold="True" Font-Size="13pt" ForeColor="White" Height="14pt" />
Desarrollo web
98
ASP .NET
</asp:Calendar> </div> </form> </body> </Html>
Desarrollo web
99
ASP .NET
Actividad -Abrir Miscrosoft Visual Studio.NET -Nuevo WebSite -Elegir ASP.NET web Site -Selecione en Location: HTTP -Escriba en direccin : http://localhost/ejercicio -Click en aceptar -En el panel de soluciones Explore haga click derecho sobre http://localhost/ejecicio y luego elija Add Item - Inserte los siguietes controles -Calendar arrestrelo y sueltelo sobre el area de trabajo -Click derecho sobre calendar y seleccione Auto Format -Elija Colorful1 y aceptar -Arrastre al escenario tres caja de texto y tres Label -A los label cambielo por nombre, edad y Pas -Arrastre 2 botones de radio -A los radio cambie el texto a cada uno "Casado" y "Civil" -Arrastre un botn y cambie el texto por guardar Siga las pantallas para uno mejor orientacin. Se da por entendido que el alumno de programacin 4 ya conoce este entorno por tal no hago mucho incapie en conocer el entorno pero har un pequeo repaso con esta practica.
-Seleccionamos ASP.NET web site y en location seleccione HTTP y cambie el nombre que aparece en la caja de texto por http://localhost/PRACTICA.
Desarrollo web
100
ASP .NET
-En el panel de soluciones Explore haga click derecho sobre http://localhost/ejecicio y luego elija Add Item
Desarrollo web
101
ASP .NET
Una vez agregado el control calenderio hacemos click derecho y seleccione Auto Format
Se nos ha desplegado una ventana en la cual selecciona la forma colorful1 y damos aceptar.
Seleccione en la caja de herramientas las cajas de texto y arrastremos tres de ella hacia el escenario.
Desarrollo web
102
ASP .NET
Arrastramos tres controles label de la caja de herramienta al escenario y cambiamos el texto por: Nombre, Edad, Pas
Arrastramos dos controles botomRadio y cambio el texto a: Casado y Soltero como se aprecia en la pantalla
Por ultimo arrastramos el control botom de la caja de herramienta al escenario y cambio el texto por Guardar y listo ya podemos ejecutar y ver nuestro formulario en un explorador web.
Desarrollo web
103
ASP .NET
Agregar cdigo a un formulario Web Form con Microsoft ASP.NET
Estudiaremos los distintos mtodos que pueden utilizarse para agregar cdigo a nuestra aplicacin Web con Microsoft ASP.NET. Tambin estudiaremos los procedimientos de evento para los controles de servidor Web, cmo utilizarlos y el orden en que funcionan. Estudiaremos el uso de las pginas de cdigo subyacente, que son el mtodo preferido de Microsoft Visual Studio .NET para agregar cdigo a pginas Web. Finamente, estudiaremos cmo se utilizan los eventos de pgina, en particular al evento Page_Load. Tambin estudiaremos cmo se utilizan las pginas de cdigo subyacente y en qu se diferencian del cdigo en lnea. Tres mtodos para agregar cdigo: -Ubicar el cdigo en el mismo archivo que el contenido (mezclado) -Ubicar el cdigo en una seccin distinta del archivo de contenido (cdigo en lnea ) -Ubicar el cdigo en un archivo distinto (pginas de cdigo subyacente) -Las pginas de cdigo subyacente son el mtodo predeterminado de Visual Studio .NET Cdigo mezclado. El cdigo se encuentra en el mismo archivo que el contenido Web, entremezclado con el contenido Hypertext Markup Language (HTML). Este mtodo es el menos elegido, ya que es difcil leer y trabajar con un archivo de este tipo. Sin embargo, es un mtodo utilizado con frecuencia en pginas Active Server Pages (ASP). Cdigo en lnea. El cdigo se encuentra en el mismo archivo en una seccin SCRIPT distinta, al igual que el contenido HTML. Cdigo subyacente. El cdigo se encuentra en un archivo distinto del contenido HTML. El archivo de cdigo se denomina pgina de cdigo subyacente. Cuando se utiliza Visual Studio .NET, el mtodo predeterminado es ubicar todo el cdigo en una pgina de cdigo subyacente. Escrbiendo Codigo en Linea <HTML> <asp:Button id="btn" runat="server"/> </HTML> <SCRIPT Language="vb" runat="server"> Sub btn_Click(s As Object, e As EventArgs) Handles btn.Click ... End Sub
Desarrollo web
104
ASP .NET
</SCRIPT> Cuando se utiliza cdigo en lnea en una pgina Web, el HTML y el cdigo se encuentran en secciones distintas de un nico archivo .aspx. Esta separacin se produce para ofrecer claridad en la lectura de la pgina; la funcionalidad, el cdigo y HTML pueden coexistir en cualquier lugar de la pgina.
Cmo funcionan las pginas de cdigo subyacente -Crean archivos distintos para la interfaz de usuario y la lgica de la interfaz -Utilizan la directiva @ Page para enlazar los dos archivos -Pre-compilacin o compilacin JIT
Desarrollo web
105
ASP .NET
Para que las pginas de cdigo subyacente funcionen, cada pgina .aspx debe estar asociada a una pgina de cdigo subyacente, y esa pgina de cdigo subyacente debe estar compilada antes de que la informacin se enve de vuelta a un navegador cliente que la solicite. Aunque cada pgina Web Form est formada por dos archivos distintos (la pgina .aspx y la pgina de cdigo subyacente), ambos archivos forman una nica unidad cuando se ejecuta la aplicacin Web. La pgina de cdigo subyacente puede ser precompilada por Visual Studio .NET cuando generamos el proyecto de aplicacin Web, o puede ser compilada just-in-time (JIT) la primera vez que un usuario accede a la pgina. Enlazar los dos archivos La pgina .aspx debe estar asociada a la pgina de cdigo subyacente. Visual Studio .NET agrega los tres atributos siguientes a la directiva @ Page de la pgina .aspx para conseguir esta asociacin: <% @ Page Language="vb" Inherits="Project.WebForm1" Codebehind="Page1.aspx.cs" Src = "Page1.aspx.cs" %> -Codebehind. Es el atributo que Visual Studio .NET utiliza internamente para asociar los archivos. -Src. Este atributo es el nombre de la pgina de cdigo subyacente, y se utiliza si la aplicacin Web no est precompilada. -Inherits. Este atributo permite a la pgina .aspx heredar clases y objetos de la pgina de cdigo subyacente. Compilacin JIT Cuando una pgina est compilada JIT, las pginas de cdigo subyacente se compilan la primera vez que un cliente solicita la pgina .aspx. Tras la primera peticin, las siguientes utilizan el archivo compilado existente. Por tanto, la primera peticin de una pgina dura ms, pero las siguientes peticiones son ms rpidas.
Desarrollo web
106
ASP .NET
Si se desea utilizar la compilacin JIT para una pgina, debera utilizarse el atributo Src de la directiva @ Page. Agregar procedimientos de evento a controles de servidor Web Los formularios Web Forms dinmicos e interactivos normalmente reaccionan a la entrada de datos del usuario. Los procedimientos de evento se utilizan para gestionar las interacciones de los usuarios en un formulario Web Form. Cuando un usuario interacta con un formulario Web Form, se genera un evento. Diseamos nuestra aplicacin Web para realizar una determinada tarea cuando se genera el evento. Un procedimiento de evento es la accin que ocurre en respuesta al evento generado. Ejemplo de un procedimiento de evento Cuando hacemos doble clic en un control en Visual Studio .NET, Visual Studio .NET declara una variable (con el mismo nombre que el atributo id del control) y crea una plantilla para el procedimiento de evento. Cuando utilizamos Visual Basic .NET, Visual Studio .NET tambin agrega la palabra clave Handles, que adjunta el procedimiento de evento al control. La palabra clave Handles permite crear mltiples procedimientos de evento a un nico evento. <form id="form1" method="post" runat="server"> <asp:Button id="cmd1" runat="server"/> </Form> El siguiente cdigo Visual Basic .NET muestra la declaracin de variables necesaria en la pgina de cdigo subyacente. Protected WithEvents cmd1 As _ System.Web.UI.WebControls.Button En el cdigo anterior, el nombre de la variable debe coincidir con el id del control Web, y debemos utilizar la palabra clave WithEvents para indicar que este control hace que se ejecuten los procedimientos de evento. En el siguiente cdigo Visual Basic .NET, que muestra el procedimiento de evento para el evento Click, la palabra clave Handles indica que el procedimiento de evento se ejecuta en respuesta al evento Click del control cmd1: Private Sub cmd1_Click(ByVal s As System.Object, _ ByVal e As System.EventArgs) _ Handles cmd1.Click
Desarrollo web
107
ASP .NET
Todos los eventos pasan dos argumentos al procedimiento de evento: el remitente del evento y una instancia de la clase que guarda los datos del evento. Normalmente, este ltimo es del tipo EventArgs, y a menudo no contiene ninguna informacin adicional; sin embargo, para algunos controles, es de un tipo que es especfico para ese control. Por ejemplo, para un control Web ImageButton, el segundo argumento es de tipo ImageClickEventArgs, que incluye informacin sobre las coordenadas donde el usuario ha hecho clic. El siguiente procedimiento de evento enva las coordenadas de la ubicacin donde ocurre un clic en un control Label: Sub img_OnClick(ByVal s As System.Object, _ ByVal e As System.Web.UI.ImageClickEventArgs) _ Handles ImageButton1.Click Label1.Text = e.X & ", " & e.Y End Sub .
Recreacin de este formulario -Inserte un label, una caja de texto y boton -Haga click derecho en label1 y reemplace el contenido por cambiar titulo -Lo mismo haga con el boton cambie el el contenido por cambiar Para generar este evento haga doble click sobre el boton lo cual lo llevara a la pagina adyacente donde esta la programacion VB codigo que no sera extrao para ustedes. Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click Label1.Text = TextBox1.Text End Sub Como pueden ver aparece este una serie de codigo pero para darnos cuenta aquien
Desarrollo web
108
ASP .NET
perntenece hay que buscar en el Handles Button,Click este atributo nos dice que tipo de control es y que eventos tiene. Solo nos resta guarda lo modificado y probarlo en nuestro explorador.
Cuando se solicita una pgina ASP.NET, se producen una serie de eventos de pgina. Estos eventos siempre ocurren en el mismo orden, denominado ciclo de vida de los eventos de pgina. El ciclo de vida de los eventos de pgina consta de los siguientes eventos de pgina, que ocurren en el siguiente orden: 1. Page_Init. Este evento de pgina inicializa la pgina creando e inicializando los controles de servidor Web de la pgina. 2. Page_Load. Este evento de pgina se ejecuta cada vez que se solicita la Pgina. 3. Eventos Control. Este evento de pgina incluye eventos de cambio (por ejemplo, Textbox1_Changed) y eventos de accin (por ejemplo, Button1_Click).
Desarrollo web
109
ASP .NET
4. Page_Unload. Este evento de pgina ocurre cuando la pgina se cierra o cuando el control pasa a otra pgina. El final del ciclo de vida de los eventos de pgina incluye el borrado de la pgina en memoria. La mayora de eventos de control no ocurren hasta que el formulario Web Form se enve de nuevo al servidor. Por ejemplo, los eventos Change se gestionan en orden aleatorio en el servidor despus de que el formulario haya sido enviado. En cambio, los eventos Click pueden hacer que el formulario sea enviado al servidor inmediatamente. Por ejemplo, si un usuario introduce texto en varios controles de un formulario y hace clic en un botn Submit, los eventos Change de los controles de texto no se procesarn hasta que el evento Click enve el formulario al servidor. Postbacks En ASP.NET, los formularios estn diseados para enviar informacin de retorno a la pgina ASP.NET remitente para su procesamiento. Este proceso se denomina postback. Los postbacks pueden producirse por determinadas acciones del usuario. De modo predeterminado, nicamente los eventos click Button hacen que el formulario sea enviado de nuevo al servidor. Sin embargo, si establecemos la propiedad AutoPostBack de un control a true, forzamos un postback para los eventos de ese control. Por ejemplo, el siguiente cdigo HTML es un ejemplo del uso de AutoPostBack en un cuadro de lista. Cada vez que el usuario modifica el valor del cuadro de lista, el evento SelectedIndexChanged se invoca en el servidor y actualiza el cuadro de texto: <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <asp:DropDownList id="ListBox1" runat="server" AutoPostBack="True"> <asp:ListItem>Tegucigalpa</asp:ListItem>
Desarrollo web
110
ASP .NET
<asp:ListItem>San Pedro Sula</asp:ListItem> </asp:DropDownList> </div> </form> </body> </Html> Este codigo pertenece a la pagina subyacente Protected Sub ListBox1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles ListBox1.SelectedIndexChanged TextBox1.Text = ListBox1.SelectedItem.Value End Sub
Desarrollo web
111
ASP .NET
Vnculo entre dos controles Podemos vincular un control con el contenido de otro. Vincular es especialmente til para mostrar valores de cuadros de lista o listas desplegables. El siguiente cdigo de ejemplo muestra cmo vincular un control Label al contenido de una lista desplegable. Utilizando las etiquetas de enlace <%# y %>, establecemos el atributo Text del control Label para el elemento seleccionado (SelectedItem) del cuadro de lista: <asp:Label id="lblSelectedValue" runat="server" Text="<%# lstOccupation.SelectedItem.Text %>" /> El siguiente ejemplo muestra el cdigo de un formulario Web Form que se utiliza para vincular el control Label al cuadro de lista: <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> </head> <body> <form id="Form1" runat="server"> <asp:DropDownList id="lstOccupation" autoPostBack="true" runat="server" > <asp:ListItem>Tegucialpa</asp:ListItem> <Asp:ListItem>San Pedro Sula</asp:ListItem> <asp:ListItem>Choluteca</asp:ListItem> </asp:DropDownList> <P>Usted selecciono: <asp:Label id="lblSelectedValue" Text="<%# lstOccupation.SelectedItem.Text %>" runat="server" />
Desarrollo web
112
ASP .NET
</p> </form> </body> </Html> En el procedimiento de evento Page_Load, invocamos el mtodo DataBind de toda la pgina o del control Label, como muestra el siguiente cdigo: Sub Page_Load (s As Object, e As EventArgs) _ Handles MyBase.Load LblSelectedValue.DataBind() End Sub
Desarrollo web
113
ASP .NET
Acceso a datos con Microsoft ADO.NET
Crear un sitio Web dinmico que responda a las peticiones de los usuarios con datos personalizados puede requerir que vinculemos nuestra aplicacin Web a varias fuentes de datos. Microsoft ADO.NET es la herramienta que nos permite acceder programticamente a fuentes de datos desde un formulario Web Form. ADO.NET est diseado para cargar datos desde una fuente de datos y trabajar con esos datos en modo desconectado. Este estado de desconexin permite al formulario Web Form operar de forma semi-independiente de las fuentes de datos, reduciendo as el trfico de red. ADO.NET utiliza Extensible Markup Language (XML) como formato universal de transmisin de datos, lo cual garantiza la interoperabilidad con cualquier plataforma donde est disponible un parser XML. Uso de DataSets frente a DataReaders DataSet Acceso lectura/escritura a Datos Incluye mltiples tablas de distintas bases de datos Desconectado Vinculado a mltiples controles Bsqueda de datos hacia delante y hacia atrs Soportado por las herramientas de Visual Studio .NET DataReaders Slo lectura Basado en una instruccin SQL de una base de datos Conectado Vinculado a un nico control Slo hacia delante Codificacin manual
Los objetos DataSet son objetos complejos que nos permiten almacenar mltiples tablas de datos DataTables desde una fuente de datos. Los objetos DataSet son como una base de datos virtual ubicada dentro de una aplicacin Web. Los objetos DataSet tambin pueden contener relaciones entre los datos de las DataTables, y pueden utilizar esas relaciones para recuperar datos. Los objetos DataReader son objetos ligeros que se utilizan para leer datos desde una fuente de datos; los objetos DataReader proporcionan acceso slo hacia delante (forward-only) y de slo lectura (read-only) a los datos de una base de datos.
Desarrollo web
114
ASP .NET
La eleccin entre utilizar objetos DataSet u objetos DataReader debera basarse en el uso previsto para los datos. Normalmente, los objetos DataReader se utilizan para leer datos en situaciones en las que es necesario el acceso una nica vez, y de solo lectura, como cuando accedemos a una contrasea almacenada, o se cumplimenta un control enlazado a una lista. Los objetos DataSet se utilizan para un acceso a datos ms complejo, como el acceso a todo el historial de pedidos de un cliente. Algunos de los aspectos relativos al acceso a datos que se deben tener en cuenta a la hora de decidir entre objetos DataSet y DataReader incluyen: - Acceso a datos Si nuestra intencin es leer y escribir a nuestra fuente de datos, debemos utilizar un objeto DataSet. Los objetos DataReader son conexiones de slo lectura y deberan utilizarse nicamente cuando los datos vayan a utilizarse en una situacin de slo lectura. -Acceso a mltiples bases de datos Si nuestra intencin es combinar tablas de una o ms bases de datos, debemos utilizar un objeto DataSet. Los objetos DataReader se basan en una nica instruccin SQL de una sola base de datos. -Enlace a controles Si nuestra intencin es enlazar los datos a ms de un control, debemos utilizar un objeto DataSet. Los objetos DataReader slo pueden vincularse a un nico control. Modo conexin Si nuestra intencin es trabajar en un modo desconectado, debemos utilizar un objeto DataSet. Los objetos DataReader deben ejecutarse en modo conectado. - Bsqueda (scanning) de datos Si nuestra intencin es buscar los datos hacia atrs y hacia delante, debemos utilizar un objeto DataSet. Los objetos DataReader buscan hacia adelante a medida que los datos fluyen desde la base de datos. -Velocidad de acceso Si necesitamos acceso de alta velocidad a nuestra fuente de datos, utilizaremos un objeto DataReader. Los objetos DataSet son ms lentos que los objetos DataReader en el acceso a una base de datos, debido a que los objetos DataSet almacenan los datos en un objeto del servidor Web. Tambin la sobrecarga es mayor en la creacin del objeto DataSet debido a la capacidad de leer y escribir datos y bsqueda hacia delante y hacia atrs.
Desarrollo web
115
ASP .NET
Los objetos DataReader son ms rpidos debido a la naturaleza del objeto ms ligera. Hay muy poca sobrecarga para el objeto DataReader, ya que ste trabaja slo hacia delante y slo de lectura. -Soporte de herramientas Si nuestra intencin es utilizar Microsoft Visual Studio .NET para crear la conexin a datos, utilizaremos objeto DataSet. Con los objetos DataSet, podemos elegir entre escribir nuestro propio cdigo o utilizar el cdigo mquina de Visual Studio .NET. Con los objetos DataReader, debemos escribir todo el cdigo de soporte. Conexin a una base de datos -Seguridad SQL Server -Crear la conexin -Demostracin: establecer la seguridad SQL Server El primer paso en el uso de una base de datos para soportar nuestra aplicacin Web es crear una conexin segura a la base de datos. Las conexiones no seguras pueden exponer a ataques mal intencionados tanto la aplicacin Web como la base de datos.
Desde la perspectiva del usuario, el acceso a datos desde una base de datos SQL Server es un proceso en dos pasos. En primer lugar, el usuario enva una peticin a la aplicacin Web, y sta se conecta a la base de datos SQL Server para satisfacer la solicitud. Existen dos mtodos principales para que una aplicacin Web se conecte a una base de datos SQL Server: autenticacin en modo mixto y autenticacin en modo slo Windows. El mtodo ms utilizado es la autenticacin slo Windows. Autenticacin En modo mixto La autenticacin en modo mixto utiliza la configuracin predeterminada de ASP.NET y de la aplicacin Web. Cada usuario de la aplicacin Web debe tener una cuenta de usuario aadida al grupo logins de SQL Server. El punto dbil de la autenticacin en modo mixto
Desarrollo web
116
ASP .NET
es que los nombres de usuario y las contraseas se envan al equipo que ejecuta SQL Server en cdigo HTML no encriptado. Estos datos expuestos podran permitir a terceros obtener las credenciales de inicio de sesin. Adems, es necesario administrar cuentas de usuario tanto en el servidor Web como en el equipo que ejecuta SQL Server. Para utilizar la autenticacin en modo mixto, configurar SQL Server en modo de autenticacin mixto (SQL Server y Windows). El siguiente cdigo puede utilizarse para conectar a un SQL Server con autenticacin en modo mixto: Dim strConn As String = "data source=localhost; " & _"initial catalog=northwind; " & _ "user id=CohoUser;password=1Coho Dim conn As New SqlConnection(strConn) Autenticacin slo Windows La autenticacin en modo slo Windows es el mtodo ms utilizado para conectar una aplicacin Web a una base de datos SQL Server. Cuando utilizamos la autenticacin en modo slo Windows, SQL Server no necesita el nombre de usuario y la contrasea. Slo se requiere una confirmacin de que el usuario ha sido autenticado por una fuente de confianza para procesar la peticin a la base de datos. El proceso de la autenticacin en modo slo Windows utiliza una sola cuenta denominada ASPNET para todos los accesos a SQL Server desde la aplicacin Web. Esta nica cuenta elimina los problemas de transmitir nombres de usuario y contraseas no encriptados entre la aplicacin Web y SQL Server, junto con la necesidad de mantener cuentas de usuario en ambos servidores. Con la autenticacin en modo slo Windows, los usuarios acceden al formulario Web Form como usuarios annimos. ASP.NET se conecta a SQL Server y se autentica utilizando la cuenta de usuario ASPNET. Los datos solicitados son devueltos por SQL Server y utilizados por la aplicacin Web. Finalmente, el formulario Web Form que incluye los datos solicitados se devuelven al usuario. Para utilizar la autenticacin en modo slo Windows, configuramos SQL Server con la autenticacin en modo slo Windows. El siguiente cdigo puede utilizarse para conectar a un SQL Server con autenticacin en modo slo Windows: Dim strConn As String = _"data source=localhost; " & _initial catalog=northwind; " & _ "integrated security=true" Dim conn As New SqlConnection(strConn)
Desarrollo web
117
ASP .NET
Configurar el SQL Server para ejecutar autenticacin en modo mixto o slo Windows Cuando utilizamos la autenticacin en modo slo Windows, podemos mantener a SQL Server en el modo de autenticacin predeterminado de slo Windows. Si utilizamos la autenticacin en modo mixto, necesitamos modificar el modo de autenticacin de SQL Server Crear la conexin Para ello, debemos identificar el nombre del servidor de base de datos, el nombre de la base de datos, y la informacin de inicio de sesin requerida. Dependiendo del tipo de base de datos al que accedamos, podemos utilizar un objeto SqlConnection o un objeto OleDbConnection. Utilizamos un objeto SqlConnection para conectar a bases de datos SQL Server 7.0 o posterior, y objetos OleDbConnection para conectar al resto de bases de datos. Creamos un objeto SqlConnection pasando una cadena de conexin que proporciona los parmetros necesarios para crear una conexin a una fuente de Datos. Dim strConn As String = _"data source=localhost; " & _"initial catalog=northwind; " & _ "integrated security=true" Dim conn As New SqlConnection(strConn) Parmetros de la cadena de conexin La siguiente tabla describe algunos de los parmetros ms habituales de un objeto de conexin: Connection Timeout: El intervalo de tiempo de espera en segundos en una conexin al servidor antes de finalizar el intento y generar una excepcin. 15 segundos es el tiempo predeterminado. Data Source: El nombre del servidor SQL Server utilizado cuando se abre una conexin, o el nombre del archivo que se utiliza cuando en la conexin a una base de datos Microsoft Access. Initial Catalog: El nombre de la base de datos. Integrated Security: El parmetro que determina si la conexin es o no segura. Los valores posibles son True, False y SSPI. SSPI es el equivalente a True.
Desarrollo web
118
ASP .NET
Password: La contrasea de inicio de sesin en la base de datos SQL Server. Persist Security Info: Cuando est establecido a False no se devuelve informacin sensible a la seguridad (como la contrasea) como parte de la conexin, si la conexin est abierta o ha estado en un estado abierto. Establecer esta propiedad a True puede constituir un riesgo de seguridad. La configuracin predeterminada es False. Provider: La propiedad que se utiliza para establecer o devolver el nombre del proveedor de la conexin; este parmetro se utiliza nicamente para objetos OleDbConnection. User ID: El nombre de cuenta de inicio de sesin de SQL Server
Desarrollo web
119
ASP .NET
Visual Studio .NET pone a disposicin dos clases principales DataAdapter para su uso con bases de datos: -Clase OleDbDataAdapter Esta clase es adecuada para utilizarse con cualquier fuente de datos expuesta por un OLE DB Data Provider. -Clase SqlDataAdapter Esta clase es especfica para una base de datos SQL Server versin 7.0 o posterior. El objeto SqlDataAdapter es ms rpido que el objeto OleDbDataAdapter porque funciona directamente con SQL Server y no debe funcionar a travs de una capa OLE DB Data Provider. Cuando utilizamos objetos DataAdapter para intercambiar datos entre un objeto DataSet y una fuente de datos, podemos especificar las acciones que deseamos realizar utilizando una de las cuatro propiedades DataAdapter. Las propiedades DataAdapter ejecutan una instruccin SQL o invocan un procedimiento almacenado. Las propiedades que estn disponibles con la clase DataAdapter se muestran en la siguiente tabla. SelectCommand: La propiedad SelectCommand recupera filas de la fuente de datos. InsertCommand: La propiedad InsertCommand escribe filas insertadas del DataSet a la fuente de datos. UpdateCommand: La propiedad UpdateCommand escribe filas modificadas del DataSet a la fuente de datos. DeleteCommand: La propiedad DeleteCommand elimina filas en la fuente de Datos. Ejemplo de SqlDataAdapter 'Create a connection Dim conn As New SqlConnection _ ("data source=localhost;initial catalog=pubs;" & _ "integrated security=true;persist security info=True;") 'Create the DataAdapter Dim da As New SqlDataAdapter _("select * from Authors", conn) Crear un DataSet Para crear una copia local de una base de datos, creamos y poblamos un objeto DataSet utilizando objetos DataTable.
Desarrollo web
120
ASP .NET
El primer paso para crear un objeto DataSet es declarar el nombre del objeto DataSet. El siguiente cdigo crea un objeto DataSet denominado ds: Dim ds As New DataSet() Tras crear un objeto DataSet, rellenamos los objetos DataTable creando un objeto DataAdapter. Invocamos el mtodo Fill en el objeto DataAdapter y especificamos el objeto DataTable que deseamos rellenar. El siguiente cdigo rellena la tabla Authors del objeto DataSet ds utilizando un DataAdapter denominado da: da.Fill(ds, "Authors") El mtodo Fill ejecuta implcitamente una consulta SQL en la propiedad SelectCommand del objeto DataAdapter. Los resultados de la consulta SQL se utilizan para definir la estructura del objeto DataTable, y para poblar la tabla con datos. El siguiente cdigo de ejemplo muestra cmo crear un objeto SqlDataAdapter da, e invocar a continuacin el mtodo Fill para almacenar los datos en el objeto DataSet ds. 'Create a connection Dim conn As New SqlConnection _("data source=localhost;initial catalog=pubs;" & _ "integrated security=SSPI;persist security info=True;") 'Create the DataSet Dim ds As New DataSet() 'Create the DataAdapter Dim da As New SqlDataAdapter _("select * from Authors", conn) 'Fill the DataSet ds da.Fill(ds, "Authors") Una vez insertados los datos en un objeto DataSet, podemos acceder programticamente a los datos. Como muestra el siguiente cdigo, cada objeto DataSet est formado por uno o ms objetos DataTable a los que podemos hacer referencia por su nombre o posicin ordinal: ds.Tables("Authors") -ods.Tables(0) Las clases DataRow y DataColumn son los componentes principales de una clase DataTable. Utilizaramos un objeto DataRow con sus propiedades y mtodos para recuperar y evaluar los valores de un objeto DataTable. DataRowCollection representa los objetos DataRow reales que se encuentran en el objeto DataTable, y
Desarrollo web
121
ASP .NET
ataColumnCollection contiene los objetos DataColumn que describen el esquema del objeto DataTable. La propiedad Rows del objeto DataTable proporciona acceso programtico a DataRowCollection. La propiedad Columns del objeto DataTable proporciona acceso programtico a DataColumnCollection. El siguiente cdigo de ejemplo agrega los nombres de columnas de un objeto DataSet al control ListBox denominado lstItems: Dim col As DataColumn For Each col In ds.Tables(0).Columns lstItems.Items.Add(col.ColumnName) Next Tanto el objeto DataRowCollection como el objeto DataColumnCollection tienen una propiedad Count que nos permite determinar el nmero de filas o columnas de un objeto DataTable, como muestra el siguiente cdigo de ejemplo: ds.Tables("Authors").Rows.Count ds.Tables("Authors").Columns.Count Contar las filas y columnas del objeto DataTable nos permite acceder a campos individuales del objeto DataTable. Podemos acceder a campos por posicin ordinal (basada-en-0) o por el nombre. En el siguiente cdigo, x es el ndice de la fila de datos a la que deseamos acceder: DataSet.Tables(0).Rows(x)(1) DataSet.Tables(0).Rows(x)("fieldname") El siguiente cdigo recorre en bucle cada fila del objeto DataTable denominado Authors y crea una cadena utilizando los campos segundo y au_lname de Authors: Dim r As DataRow Dim str As String For Each r in ds.Tables("Authors").Rows str &= r(1) str &= r("au_lname") Next
Utilizar un DataView
Para mostrar los datos que almacena un objeto DataSet, podemos vincular el objeto DataSet directamente a un control enlazado a una lista o utilizar un objeto DataView. Un objeto DataView es una vista personalizada y enlazable de un nico objeto DataTable.
Desarrollo web
122
ASP .NET
Despus de crear un objeto DataView, el usuario puede utilizarlo para clasificar, filtrar, buscar, editar y navegar por datos. Los objetos DataView pueden personalizarse para presentar un subconjunto de datos de un objeto DataTable. Esta personalizacin permite tener dos controles vinculados al mismo objeto DataTable, pero con cada control mostrando distintas versiones de los datos. Por ejemplo, un control puede estar vinculado a un objeto DataView mostrando todas las filas de la tabla, y un segundo control puede estar vinculado a otro objeto DataView configurado para mostrar nicamente las filas que se han eliminado del objeto DataTable. Cada objeto DataTable de un objeto DataSet tiene una propiedad DefaultView, que devuelve la vista predeterminada de la tabla. El siguiente cdigo muestra cmo podemos acceder al objeto DataView dv predeterminado, de un objeto DataTable denominado Authors: Dim dv As DataView = ds.Tables("Authors").DefaultView
Desarrollo web
123
ASP .NET
Administracin del estado
Microsoft ASP.NET permite administrar el estado de una aplicacin Web. El estado es la capacidad de una aplicacin Web de conservar la informacin del usuario. La conexin que se establece entre un usuario (el equipo cliente) y un servidor Web se denomina sesin. Las sesiones pueden abarcar mltiples pginas Web y su seguimiento se realiza mediante la administracin del estado. La administracin del estado es el proceso por el cual mantenemos la misma informacin a travs de mltiples peticiones para las mismas o distintas pginas Web.
Al igual que las tecnologas basadas en Hypertext Transfer Protocol (HTTP), los formularios Web Forms no tienen estado, lo que significa que no indican automticamente si las peticiones de una secuencia son todas del mismo cliente ni si una nica instancia de navegador sigue visualizando de forma activa una pgina Web o un sitio Web. Adems, las pginas Web se destruyen y vuelven a crearse a continuacin con cada nueva peticin al servidor Web; por tanto, la informacin de las pginas no existe ms all del ciclo de vida de una nica pgina. ASP.NET ofrece una administracin del estado que guarda informacin en el servidor entre pginas, que ayuda a mantener la continuidad de la informacin del usuario (estado) durante una visita a un sitio Web. Si se mantiene el estado entre pginas, la informacin suministrada originalmente por los usuarios puede ser reutilizada; por ello, los usuarios no necesitan volver a introducir la misma informacin varias veces cada vez que se enva una pgina de retorno al servidor. Por ejemplo, en la ilustracin anterior, el usuario, John Chen, introduce su nombre en el
Desarrollo web
124
ASP .NET
formulario login.aspx. Despus de introducir sus datos personales, esa informacin se enva al servidor y se muestra la pgina siguiente, el formulario greetings.aspx. Sin administracin del estado, la informacin que el usuario ha introducido en la primera pgina se ha perdido. Sin embargo, si se utiliza administracin del estado en la aplicacin Web, puede mantenerse el estado a travs de varias pginas Web. Por tanto, cuando la informacin personal del usuario se enva al servidor, la segunda pgina, el formulario greetings.aspx, da la bienvenida al usuario con su nombre, John Chen, que el usuario introdujo en el formulario login.aspx, la primera pgina de la aplicacin Web.
ASP.NET proporciona dos tipos de administracin del estado que pueden utilizarse para mantener el estado entre envos y respuestas al servidor. La eleccin de uno de los dos tipos de administracin del estado disponibles en ASP.NET depende principalmente de la naturaleza de la aplicacin Web. Los dos tipos de administracin del estado son: -Lado servidor Las opciones de la administracin del estado en el lado del servidor utilizan recursos del servidor para almacenar la informacin del estado. La seguridad de estas opciones es mayor que en el lado del cliente. -Lado cliente La administracin del estado en el lado del cliente no utiliza recursos del servidor para almacenar la informacin del estado. Las opciones en el lado del cliente tienden a tener
Desarrollo web
125
ASP .NET
seguridad mnima, pero ofrecen un rpido rendimiento del servidor porque no existe demanda en el servidor para mantener el estado. La administracin del estado en el lado del servidor contiene diferentes opciones a escoger, incluyendo: - Estado de aplicacin En el estado de aplicacin, la informacin est disponible para todos los usuarios de una aplicacin Web; por ejemplo, almacenar el nmero de visitantes a una aplicacin Web. -Estado de sesin En el estado de sesin, la informacin est disponible nicamente para un usuario de una sesin especfica de una aplicacin Web; por ejemplo, almacenar el esquema de colores preferido de un usuario. Base de datos Microsoft SQL Server o un servidor de estado Otra opcin de la administracin del estado en el lado del servidor es utilizar la tecnologa de bases de datos. Podemos utilizar una base de datos SQL Server o un servidor de estado para almacenar informacin especfica del usuario cuando el almacn de informacin es de gran tamao. La base de datos SQL Server o un servidor de estado pueden utilizarse conjuntamente con el estado de sesin y cookies. -El objeto Cache Tambin podemos utilizar el objeto Cache para administrar el estado a nivel de aplicacin. Del lado del Cliente La administracin del estado en el lado del cliente tambin ofrece distintas opciones para mantener el estado. Estas opciones incluyen: -Cookies Una cookie es un archivo de texto que puede utilizarse para almacenar pequeas cantidades de informacin necesarias para mantener el estado. -La propiedad ViewState Los formularios Web Forms proporcionan la propiedad ViewState como una estructura incluida para conservar automticamente valores entre mltiples peticiones a la misma pgina. La propiedad ViewState se mantiene como un campo oculto en la pgina. -Cadenas de consulta Una cadena de consulta es informacin que se aade al final de una URL (Uniform Resource Locator). Un ejemplo tpico podra ser el siguiente: http://www.contoso.com/listwidgets.aspx?category=basic&price=100
Desarrollo web
126
ASP .NET
En la ruta URL anterior, la cadena de consulta se inicia con un signo de interrogacin (?) e incluye dos pares atributo-valor, categora y precio.
El archivo Global.asax
El archivo global.asax es un archivo declarativo que se utiliza para la gestin de eventos mientras la aplicacin Web se est ejecutando. Algunas de las caractersticas del archivo global.asax son: -Por cada aplicacin Web ASP.NET se soporta un archivo global.asax. -El archivo global.asax se almacena en la raz del directorio virtual de la aplicacin Web. -El archivo global.asax puede gestionar eventos de aplicacin y de sesin (inicio y final) que pueden utilizarse para inicializar variables de aplicacin y de sesin. -El archivo global.asax es opcional. Si no definimos el archivo, el marco de trabajo de las pginas ASP.NET asume que no hemos definido ningn controlador de eventos de aplicacin o sesin El archivo global.asax soporta tres categoras de eventos: -Eventos que se invocan cuando se solicita una pgina. -Eventos que se invocan cuando se enva la pgina solicitada. -Eventos de aplicacin condicionales. La siguiente tabla lista los eventos que se invocan cuando se solicita una Pgina. Application_BeginRequest: Este evento se invoca cada vez que se recibe una nueva peticin. Application_AuthenticateRequest: Este evento indica que la peticin est preparada para ser autenticada. Application_AuthorizeRequest: Este evento indica que la peticin est preparada para ser autorizada. Application_ResolveRequestCache: Este evento es utilizado por el mdulo de la cach de salida para detener el procesamiento de peticiones que han sido almacenadas en cach. Application_AcquireRequestState: Este evento indica que debera obtenerse el estado para cada peticin.
Desarrollo web
127
ASP .NET
Application_PreRequestHandlerExecute: Este evento indica que el gestor de peticiones est a punto de ejecutarse. Eventos invocados cuando se enva la pgina solicitada Global.asax tambin incluye eventos invocados cuando la pgina solicitada se enva de vuelta al cliente. La siguiente tabla lista estos eventos. Application_PostRequestHandlerExecute: Este evento es el primero disponible despus de que el controlador, como una pgina ASP.NET o un servicio Web, haya finalizado su trabajo. Application_ReleaseRequestState: Este evento se invoca cuando el estado de la peticin debe almacenarse, porque la aplicacin Web ASP.NET finaliza con l. Application_UpdateRequestCache: Este evento indica que el procesamiento de cdigo ha finalizado y que el archivo est preparado para ser agregado a la cach de ASP.NET. Application_EndRequest: Este evento es el ltimo evento que se invoca cuando finaliza la aplicacin Web ASP.NET. Eventos de aplicacin condicionales Los eventos de aplicacin condicionales son eventos que pueden o no ser lanzados durante le procesamiento de una peticin. La siguiente tabla muestra algunos de los eventos de aplicacin condicionales ms habituales. Application_Start: Este evento se invoca cuando se inicia una aplicacin Web ASP.NET. Application_End: Este evento es otro evento de ocurrencia nica. Es el evento ecproco de Session_Start: Este evento se invoca cuando se inicia la Session de un usuario en una aplicacin Web ASP.NET. Session_End: Este evento es un evento reciproco de Session_Start; este evento se invoca cuando finaliza la sesin de un usuario. Application_Error: Este evento se invoca cuando ocurre un error no controlado en una aplicacin Web ASP.NET.
Desarrollo web
128
ASP .NET
Variables de aplicacin y de sesin
Podemos utilizar las variables de aplicacin y de sesin para compartir informacin entre las pginas de una aplicacin Web ASP.NET. Estudiaremos cmo inicializar y utilizar las variables de aplicacin y de sesin. Tambin estudiaremos cmo especificar la duracin de las variables de aplicacin y de sesin y cmo afectan al almacenamiento escalable. Finalmente, estudiaremos cmo almacenar las variables de aplicacin y de sesin en una base de datos. Inicializamos las variables de aplicacin y de sesin en los procedimientos de eventos Start de los objetos Application y Session del archivo global.asax. Utilizamos el objeto Session para almacenar la informacin necesaria de una sesin de usuario concreta. Las variables que se almacenan en el objeto Session no se desecharn cuando el usuario viaje por las distintas pginas de la aplicacin Web. En lugar de ello, estas variables persistirn durante toda la sesin del usuario. El siguiente cdigo de ejemplo muestra cmo se utilizan las variables de sesin para almacenar el esquema de colores preferido de una determinada sesin de Usuario: Sub Session_Start(ByVal Sender As Object, _ByVal e As EventArgs) Session("Color1") = "beige" Session("Color2") = "black" End Sub Podemos utilizar el objeto Application para compartir informacin de estado entre todos los usuarios de una aplicacin Web. Cuando el primer usuario de la aplicacin Web solicita un archivo .aspx, se crea un objeto Application. El objeto Application se destruye cuando todos los usuarios han abandonado la aplicacin Web y, a continuacin, se descarga la aplicacin Web. Por ejemplo, podramos almacenar el nmero total de visitantes de un sitio Web en una variable de nivel de aplicacin: Sub Application_Start(ByVal Sender As Object, _ByVal e As EventArgs) Application("Numero_visitantes") = 0 End Sub Para utilizar variables de aplicacin y de sesin en ASP.NET, simplemente utilizamos una clave de cadena y establecemos un valor. Para establecer la variable de sesin, debemos proporcionar una clave que identifique el elemento que estamos almacenando, utilizando una instruccin
Desarrollo web
129
ASP .NET
como la siguiente: Session("Color") = "azul La instruccin anterior agrega una clave, denominada Color, al estado de sesin con el valor azul. Puede accederse a las variables de aplicacin en un entorno de mltiples usuarios; por ello, cuando se actualicen los datos de Application, debemos evitar que otros usuarios o aplicaciones actualicen los datos simultneamente. ASP.NET proporciona un sencillo conjunto de mtodos de bloqueo, Application.Lock() y Application.UnLock(), que pueden utilizarse para evitar el acceso mltiple y simultneo de la variable de aplicacin. El siguiente cdigo muestra el uso de los mtodos Application.Lock() y Application.UnLock(): Application.Lock() Application("Numero_visitante") += 1 Application.UnLock() Para utilizar una variable de sesin o de aplicacin en una pgina ASP.NET, simplemente necesitamos leer el valor del objeto Session o Application: strBgColor = Session("Color") lblNbVisitor.Text = Application("Numero_visitante) Ejemplo -Cree dos formularios ASP.NET -A formulario uno insertamos un control HyperLink y le cambiamos el titulo por Siguiente.Vamos ala propiedad NavigateUrl hacemos click en el boton que tiene en lateral derecho ahi eligimos el formulario 1 que creamos. -Insertamos una control Label y sustituimos el contenido por un valor (0) -Insertemo otro label y sustituimos el contenido por Contador 1 -Abrimos la hoja de codigo adyacente que contiene el evento page_load y escribios el siguiente codigo: Session(contador)+=3 Label1.Text= Session(contador2) + 1 -El fomulario numero 2 que creamos insertemos un control HyperLink y cambiamos el contenido por Atras. Vamos ala propiedad NavigateUrl hacemos click en el boton que tiene en lateral derecho ahi eligimos el formulario 1 que creamos. -Insertamos una control Label y sustituimos el contenido por un valor (0)
Desarrollo web
130
ASP .NET
-Insertemo otro label y sustituimos el contenido por Contador 2 -Abrimos la hoja de codigo adyacente que contiene el evento page_load y escribios el siguiente codigo: Session(contador2)+=4 Label1.Text= Session(contador) + 1
Desarrollo web
131
ASP .NET
cookie persistente depende del tiempo de expiracin establecido en el cdigo. En el cdigo anterior, la cookie persistente se eliminar transcurrida una hora. El siguiente cdigo agrega la nueva cookie a la coleccin de cookies del objeto Response: Response.Cookies.Add(objCookie) Supongamos que deseamos crear una cookie, denominada Username, que contiene el nombre de un visitante a nuestro sitio Web. Para crear esta cookie, el servidor Web enviar un encabezado HTTP como muestra el siguiente cdigo: Set-Cookie: Username=John+Chen; path=/; domain=microsoft.com; Expires=Tuesday, 01-Feb-05 00.00.01 GMT El encabezado del cdigo de ejemplo anterior manda al navegador que agregue una entrada a su archivo cookie. El explorador agrega la cookie, denominada Username, con el valor John Chen. El atributo domain del cdigo de ejemplo anterior limita el dominio dnde el navegador puede enviar la cookie. En el cdigo de ejemplo anterior, la cookie nicamente puede enviarse al sitio Web Microsoft.com. La cookie nunca se enviar a ningn otro sitio Web de Internet. Despus de que el servidor Web cree una cookie, el navegador la devuelve en cada peticin que realiza a ese sitio Web. El explorador devuelve la cookie en un encabezado similar al siguiente: Cookie: Username: John+Chen Las cookies que se almacenan en formato de archivo de texto son las cookies persistentes. De forma predeterminada, este archivo se almacena en la carpeta \Documents and Settings\NombreUsuario\Cookies. Cuando las cookies persistentes se almacenan utilizando Internet Explorer, el formato del archivo de texto es: NombreUsuario@NombreDominio.txt Con esto finalizamos la serie de ASP.NET con estos concepto basico ya estmos listo para poder crear paginas ASP.NET es ya voluntad propia si desean ahondar mas en sobre esta tectologa de desarrollo web. Acontinuacion se presenta una serie de codigo con el fin de que puedan analizar e identificar que es HTML, CSS, y ASP.NET
Desarrollo web
132
ASP .NET
Actividad
Este archivo codigo es el HTML que lo pueden copiar en nuevo formulario que lo pueden crear en ASP.NET. Antes darle copy y paste traten de realizarlo desde cero esto les ayudara a poder comprender aun mas lo visto en este libro y el cdigo nuevo que encuentre detenerse e investigarlo. <%@ Page Language="vb" Inherits="primera" src="apoyo/primera.vb" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> Primera pgina ASP.NET </title> <meta name="Generator" content=""> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <style> a:link {color: Blue; font-weight: bold;} a:visited{color: Purple; font-weight: bold;} a:hover{color: Red; font-weight: bold;} body {margin-left: 15px; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; fontsize: 10pt;} table {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 10pt;} </style> </head> <body> <div align="center"> <table align="center" border="0" width="550" id="table1"> <tr> <td> <p align="justify">Pgina sencilla con varios controles Web de tipo etiqueta (<b>asp:label</b>), en una de ellas se muestra una variable, contenida en un cuadro de texto (<b>asp:textbox</b>), al pulsar en un botn (<b>asp:button</b>) que forman parte de un formulario Web (<b>asp:form</b>). Tambin hay un control imagen (<b>asp:image</b>) que slo se hace visible al pulsar el botn.<br /> </td> </tr> </table>
Desarrollo web
133
ASP .NET
<br> <asp:Label id="lbMensaje1" font-bold="True" font-size="22pt" forecolor="blue" runat="server"></asp:Label> </div> <div align="center"> <form runat="server"> <h3 align="center"><font color="blue">Escribe tu nombre:</font></h3> <div align="center"> <asp:TextBox id="tbMensaje" Width="102px" Runat="server"></asp:TextBox> <asp:Button id="btEnviar" onclick="tbMensaje_Change" Runat="server" BorderWidth="2px" BorderStyle="Solid" BackColor="White" ForeColor="Black" Text="Enviar"></asp:Button> <p></p> <asp:Label id="lbMensaje2" font-bold="True" font-size="14pt" forecolor="blue" runat="server"></asp:Label> <asp:Label id="lbMensaje3" font-bold="True" font-size="10pt" forecolor="blue" runat="server"></asp:Label> <br><br> <asp:Image id="Image1" runat="server" ImageUrl="../img/net.gif"></asp:Image> </div> </form> </Div> </Body>
Desarrollo web
134
ASP .NET
Este el codigo escrito en lenguaje Visual Basic en otras palabras este cdigo tendrn que copiarlo a la pagina adyecente de la pagina anteriormente hecha Imports System Imports System.Web Imports System.Web.UI Imports System.Web.UI.WebControls Public Class primera : Inherits Page Public tbMensaje As TextBox Public btEnviar As Button Public lbMensaje1 As Label Public lbMensaje2 As Label Public lbMensaje3 As Label Public Image1 As Object Sub Page_Load (obj as Object, e as EventArgs) lbMensaje1.Text = "Bienvenido a ASP.NET" Image1.Visible = False End Sub Sub tbMensaje_Change (sender as Object, e as EventArgs) If tbMensaje.Text = "" Then lbMensaje2.Text = "" lbMensaje3.Text = "(Escribe tu nombre en la caja de texto)" Else lbMensaje3.Text = "" lbMensaje2.Text = "Hola, " + tbMensaje.Text.ToUpper() Image1.Visible = True End If End Sub End Class
Desarrollo web
135
ASP .NET
Este seria el resultado final con la inmagen pueden usar otra o bien la pueden buscar en la web.
Desarrollo web
136