Universidad Nacional, Sede Regin Brunca, Escuela de Informtica Programacin IV, I Semestre Ao 2012

Demostracin B: convertir controles HTML en controles de servidor

***************************** use****************************** Visual Studio .NET facilita la conversin de controles HTML en controles de servidor.

Ejecutar esta demostracin

1. Visualizar la pgina HTMLPage.aspx que convertimos de una pgina HTML en la demostracin anterior, en la vista HTML, y agregar un atributo runat="server" a los controles de cuadro de texto, seleccin y el de envo. 2. Hacer clic en Guardar para guardar el proyecto. 3. Visualizar la pgina HTMLPage.aspx en el navegador haciendo clic con el botn derecho en la pgina en el Explorador de soluciones y haciendo clic en Visualizar en el navegador. No es necesario volver a generar el proyecto, ya que no se ha cambiado el cdigo. 4. Visualizar el cdigo fuente de la pgina para mostrar los cambios realizados. Se ha agregado un atributo name a cada control de servidor. 5. Cerrar la vista del cdigo fuente HTML en el navegador. 6. En el navegador, introducir informacin en los controles, y hacer clic en Guardar. Los controles todava pierden sus valores. 7. Editar la pgina y agregar un atributo runat="server" al formulario. 8. Guardar los cambios y visualizar la pgina de nuevo en el navegador. No es necesario volver a generar el proyecto ya que no se ha agregado ningn cdigo. 9. Visualizar el cdigo fuente de la pgina para mostrar los cambios realizados. Entre otros cambios, se han agregado los atributos action y method a la etiqueta del formulario y se ha creado un control oculto denominado __VIEWSTATE. 10. Cerrar la vista del cdigo fuente HTML en el navegador. 11. Introducir informacin en los controles y hacer clic en Guardar. Ahora, los controles guardan sus valores.
Demostracin02, Crear Formularios en Web Form con Microsoft ASP.NET

Universidad Nacional, Sede Regin Brunca, Escuela de Informtica Programacin IV, I Semestre Ao 2012

Agregar una etiqueta al formulario Web Form: 12. Editar la pgina y agregar un control de servidor Web Label al formulario Web Form, debajo del botn Guardar: <asp:label id="lblMessage" runat="server">Label</asp:label> 13. Guardar los cambios y visualizar la pgina en el navegador. 14. Visualizar el cdigo fuente de la pgina. El control de servidor Web Label genera un elemento <span>. 15. Cerrar la vista del cdigo fuente HTML en el navegador. Uso de SmartNavigation: 16. Visualizar la pgina http://localhost/Demos03/HTMLPage.aspx en Internet Explorer y modificar el tamao del navegador para que muestre verticalmente menos que la pgina completa. La barra de desplazamiento vertical debera estar visible. 17. Desplazarse hacia abajo y hacer clic en Guardar. Seremos redirigidos a la parte superior de la pgina debido al postback. 18. Cerrar el navegador. 19. Editar la pgina en la vista HTML y agregar SmartNavigation= "true" a la directiva @ Page. El cdigo HTML debera ser parecido al siguiente: Visual Basic .NET <%@ Page SmartNavigation="true" Language="vb" CodeBehind="HTMLPage.aspx.vb" AutoEventWireup="false" Inherits="Mod04.HTMLPage" %> C# <%@ Page SmartNavigation="true" Language="c#" CodeBehind="HTMLPage.aspx.cs" AutoEventWireup="false" Inherits="Mod04.HTMLPage" %> 20. Guardar los cambios y visualizar la pgina en otro navegador cuyo tamao se haya modificado. 21. Desplazarse hacia abajo y hacer clic en Guardar. Esta vez, no somos redireccionados a la parte superior de la pgina durante el postback, la pgina mantiene su posicin actual. 22. Visualizar el cdigo fuente de la pgina en el navegador. En Internet Explorer 4.0 y posterior, el atributo SmartNavigation crea IFrames para actualizar nicamente la parte modificada de la pgina. 23. Cerrar la vista del cdigo fuente HTML en el navegador.

Demostracin02, Crear Formularios en Web Form con Microsoft ASP.NET