1 / 50

Clase XI

Clase XI. [nombre instructor] [fecha]. Agenda. ASP.NET Introducción Modelo de Código de Página Web ASP.NET Manejo de Estado Controles WebControls & HTMLControls UserControls & CustomControls CallBacks en Clientes Acceso de Datos. Agenda. ASP.NET Introducción

murray
Download Presentation

Clase XI

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Clase XI • [nombre instructor] • [fecha]

  2. Agenda • ASP.NET • Introducción • Modelo de Código de Página Web ASP.NET • Manejo de Estado • Controles WebControls & HTMLControls • UserControls & CustomControls • CallBacks en Clientes • Acceso de Datos

  3. Agenda • ASP.NET • Introducción • Modelo de Código de Página Web ASP.NET • Manejo de Estado • Controles WebControls & HTMLControls • UserControls & CustomControls • CallBacks en Clientes • Acceso de Datos

  4. Client-Side Event Procedures • Típicamente usado solo con controles HTML • Interpretado por el explorador y ejecutado sobre el cliente • No tiene acceso a los recursos de servidor • Usa <SCRIPT language="language"> .HTM Pages Internet ASP.NET

  5. Server-Side Event Procedures • Usado con controles de servidor Web y HTML • El código es compilado y ejecutado sobre el servidor • Se tiene acceso a los recursos del servidor • Usa <SCRIPT language="vb" runat="server"> o <SCRIPT language=“cs" runat="server"> .ASPX Pages Internet ASP.NET

  6. La pagina es desechada Entendiendo el ciclo de vida de una pagina Page_Init Page_Load Control events Textbox1_Changed Evento Change Button1_Click EventoAction Page_Unload ASP.NET

  7. El proceso Postback ASP.NET

  8. ASP.NET Web Application ASP.NET Web Server Clients Web Forms Web.config Page1.aspx Code-behind pages Output Cache Internet Page2.aspx machine.config global.asax WebServices Database Components XML Data ASP.NET

  9. ASP.NET Execution Model ASP.NET

  10. Las aplicaciones Web ASP.NET componentes • Formularios Web o páginas .ASPX: Proveen de la interfase visual. No tienen código ejecutable. • Páginas de Código por detrás: Están asociadas con cada formulario y son las que proveen del código ejecutable. • Archivos de Configuración: Son archivos que permiten configurar la aplicación, por ejemplo el archivo Web.config y el servidor por ejemplo el archivo machine.config. • Global.asax: Es un archivo que contiene código. Este código responde a eventos que se disparan en la aplicación Web. ASP.NET

  11. Proyecto Web • Formulario Web ASP.NET (.aspx): Es la interfase visual de la aplicación Web. Puede tener código por detrás., cuyo nombre es Formulario.aspx.vb o Formulario.aspx.cs • Clases y código por detrás (.cs y .vb): Son las clases que utiliza el proyecto y el código de soporte de los formularios y los servicios. • Clase Global (.asax):Es un archivo que contiene código de eventos a nivel de aplicación. • Web.config: Es un archivo XML con información de configuración. • Archivos ensamblados del proyecto (.dll):Todas las paginas de código por detrás de una aplicación son compilados en un solo DLL que se guarda en el directorio /bin con el nombre de NombreDeProyecto.dll • VsProj o CsProj:Vs Proj es la extensión de un proyecto si usted escribió la aplicación en Visual.NET. CsProj es la extensión si utilizo c# ASP.NET

  12. <%@ Page Language="vb" Codebehind="WebForm1.aspx.vb" SmartNavigation="true"%> <html> <body ms_positioning="GridLayout"> <form id="Form1" method="post" runat="server"> </form> </body> </html> Que es un Web Form? • Extensión .aspx • Atributos de pagina • Directiva @ Page • Atributos de Body • Atributos de Formularios ASP.NET

  13. Repositorio central de configuración de la aplicación Web Definición de settings personaliados Configuración de Autorización y Autenticación Web.config

  14. Creando un Web Form con Visual Studio .NET - Demo • Creación de nuevos Web Form • Agregar nuevos Web Forms desde el explorador de soluciones • Actualizar paginas HTML existentes dentro de Web Forms ASP.NET

  15. Modelo de Código de Página Web • Una Página Web ASP.NET consta de dos partes: • Elementos visuales, que incluyen controles del servidor y texto estático. • Programación lógica para la página, que incluye manejador de eventos y el resto del código. • Modelos de Página • Modelo de Página Single-File • Modelo de Página Code-Behind ASP.NET

  16. El modelo Code-Behind • Toma ventajas del nuevo Partial Classes • El archivo Code-behind no es una definición completa de clase. Un archivo code-behind podría ser el siguiente using System; public partial class SamplePage_aspx { void Button1_Click(Object sender, EventArgs e) { Label1.Text = "Clicked at " + DateTime.Now.ToString(); } } Directiva @ Page <%@ page language="C#" CodeFile="SamplePage.aspx.cs" Inherits="SamplePage" %> ASP.NET

  17. El Modelo Code-Behind • El archivo code-behind es más simple. • Incluye controles de usuario en una página, sin tener que crear explícitamente las variables para ellos. • Más fácil de separar el desarrollo del markup y del código. ASP.NET

  18. Que es el View State • Técnicas utilizadas por ASP.NET para mantener el estado de los controles. • Problemas comunes al uso de View State • Incremento en el tiempo de la carga de la pagina • Incremento en el tamaño de la pagina. ASP.NET

  19. Solución de problemas de rendimiento en View State • Desactivar la propiedad EnableViewState para el control correspondiente. • Desactivar la propiedad EnableViewState en la directiva @Page • Guardar el View State en archivos del sistema del servidor en lugar de campos ocultos ASP.NET

  20. Que es el Control State • Reemplaza el private use de View State • Private use de view state ocurre cuando un control almacena propiedades no publicas en view state • Las aplicaciones no pueden acceder a propiedades no publicas por problemas de protección ASP.NET

  21. Session State • Definición de almacenes personalizados de session state. • Nuevo modelo extensible • Personalización del modelo de session state ASP.NET

  22. Cache • La clase CacheDependency encapsula mecanismos de dependencia de cache • Representa un archivo o carpeta o conjunto de archivos y carpetas que almacenan ítems relacionados a un ítem agregado a la cache • ASP.NET tiene soporte para dependencias personalizadas ASP.NET

  23. Controles • HTML vs. Server Controls • User controls • Custom controls ASP.NET

  24. HTML (HTMLControls) Más livianos Modelo de programación HTML Menor funcionalidad Server Controls (WebControls) Modelo de programación orientado a objetos Mayor funcionalidad Más pesados HTML vs. Server Controls ASP.NET

  25. Que es un control de usuario? • User controls simplifica la reutilización del código y los componentes de la UI con una aplicación Web • Un user control es un control Web server definido por el usuario con extensión .ascx • Contiene HTML, pero no el <HTML>, <BODY>, o las etiquetas <FORM> o • Contiene código para administrar sus propios eventos <%@ Control Language="vb" %> <%@ Control Language="c#" %> ASP.NET

  26. Que es un control de usuario? • Similar a una página Web Form completa • Tiene una página de interfaz de usuario y un archivo de código subyacente • Directiva @Control • Extensión .ascx • No tiene elementos <HTML>, <BODY> y <FORM> • Contiene código para manejar sus propios eventos • Hay dos maneras de crear un Control de Usuario: • Crear un nuevo Control de Usuario • Convertir una página ASP.NET existente a un Control de Usuario ASP.NET

  27. Que es un control de usuario? • Registre el control de usuario al comienzo de la página del Web Formscontenedor con la directiva @Reference2. • Cree una instancia del control de usuario, ya sea en el archivo de la clase del código subyacente o en el bloque de declaración de código del archivo contenedor .aspx • <%@ ReferenceControl=“myUserControl.ascx" %> • Control userControl1= LoadControl(“myUserControl.ascx");((myUserControl)userControl1).Color = “red";Page.Controls.Add(userControl1); ASP.NET

  28. Demo • Creación de un Web Form user control

  29. Demo • Agregar user control a Web Forms

  30. Custom Controls • Los controles pueden ser reutilizables • Se pueden generar nuevos controles ASP.NET

  31. Creando Custom Controls • Diferentes maneras de crear Controles Personalizados • Compilar un control que combine la funcionalidad de dos o más controles existentes • Personalizar un Control existente derivando de este y reemplazando (overriding) sus características • Crear un control personalizado al derivar de la clase base Control ASP.NET

  32. UserControls vs CustomControls • Controles de Usuario • Mas fáciles de crear • No pueden ser agregados a la Caja de Herramientas de Visual Studio • Buenos para contenidos estáticos • Controles Personalizados • Mas difíciles de crear • Pueden ser agregados a la Caja de Herramientas de Visual Studio • Buenos para contenidos dinámicos ASP.NET

  33. Callbacks en Clientes • Postbacks "Ligeros" • El administrador de Callbacks del cliente transmite peticiones asincrónicas de XML-HTTP al servidor • El servidor recibe y procesa la petición, pero no renderiza la página • El administrador de Callbacks del cliente recibe la respuesta y notifica al cliente a través de un CallBack registrado • Requiere Internet Explorer 5.0 o superior • Gran manera de mejorar la respuesta de la UI ASP.NET

  34. Como trabajan los CallBacks en Cliente Cliente Servidor 1 2 Administra-dor de Llamadas de Respuesta Cliente Página El cliente inicia el CallBack llamando por a un GetCallback-EventReference El administrador de CallBacks lanza la llamada asincrónica XML-HTTP al servidor. 3 Se llama al método RaiseCall-backEvent 5 4 El cliente es notificado que la llamada se completó y el resultado fue entregado El administrador de CallBacks es notificado que la llamada se completó ASP.NET

  35. Demo • Client CallBacks

  36. Acceso de Datos • Controles de la Fuente de Datos • Declarativas bidireccionales de data binding • Controles de Datos • GridView- Como DataGrid, pero mejor • DetailsView – Acompaña la GridView ASP.NET

  37. ASP.NET Data Binding • Usando SqlDataSource <asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="server=localhost;database=pubs;integrated security=true" SelectCommand="select title_id, title, price from titles" /> <asp:DataGrid DataSourceID="Titles" RunAt="server" /> ASP.NET

  38. ASP.NET Data Binding • Propiedades clave de SqlDataSource Nombre Descripción ConnectionString La secuencia de conexión es usada para conectarse al origen de datos SelectCommand Comando utilizado para efectuar consultas InsertCommand Comando utilizado para realizar inserts UpdateCommand Comando utilizado para realizar actualizaciones DeleteCommand Comando utilizado para efectuar cancelaciones DataSourceMode Especifica si el DataSet o el DataReader es utilizado (default = DataSet) ASP.NET ProviderName Especifica el Proveedor (default = Proveedor SQL Server .NET)

  39. ASP.NET Data Binding • Comandos Parametrizados • Las propiedades XxxParameters permiten que los comandos de base de datos sean parametrizados. Nombre Descripción SelectParameters Especifica los parámetros para SelectCommand InsertParameters Especifica los parámetros para InsertCommand UpdateParameters Especifica los parámetros para UpdateCommand DeleteParameters Especifica los parámetros para DeleteCommand ASP.NET FilterParameters Especifica los parámetros para FilterExpression

  40. ASP.NET Data Binding • Parámetro de Control • Ata un parámetro reemplazable a una propiedad de control <asp:SqlDataSource ID="Countries" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select distinct country from customers order by country" /> <asp:SqlDataSource ID="Customers" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select * from customers where country=@Country"> <SelectParameters> <asp:ControlParameter Name="Country" ControlID="MyDropDownList" PropertyName="SelectedValue" /> </SelectParameters> </asp:SqlDataSource> <asp:DropDownList ID="MyDropDownList" DataSourceID="Countries" DataTextField="country" AutoPostBack="true" RunAt="server" /> <asp:DataGrid DataSourceID="Customers" RunAt="server" /> ASP.NET

  41. ASP.NET Data Binding • XmlDataSource • Data binding declarativo a datos XML • Soporta cacheo y transformaciones XSL • Data binding unidireccional solamente; sin actualizaciones <asp:XmlDataSource ID="Rates" DataFile="Rates.xml" RunAt="server" /> <asp:TreeView ID="MyTreeView" DataSourceID="Rates" RunAt="server" /> ASP.NET

  42. Laboratorio • XMLDataSource

  43. Control GridView • Control DataGrid mejorado • Renderiza conjuntos de registros como tablas HTML • Clasificación, paginado, selección, actualización y soporte de borrado incorporados. • Declarado en elementos <Columns> • UI altamente personalizable ASP.NET

  44. Control GridView <asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select lastname, firstname, title from employees" /> <asp:GridView DataSourceID="Employees" Width="100%" RunAt="server" /> ASP.NET

  45. Control GridView Nombre Descripción BoundField Renderiza columnas de texto de campos en data source ButtonField Renderiza columna de botones (push button, image, or link) CheckBoxField Renderiza Booleanos como check boxes CommandField Renderiza controles para seleccionar y editar datos de GridView HyperLinkField Renderiza columnas de hyperlinks ImageField Renderiza columnas de imágenes TemplateField Renderiza columnas usando plantillas HTML ASP.NET

  46. Control GridView <asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select photo, lastname, firstname, title from employees" /> <asp:GridView DataSourceID="Employees" Width="100%" RunAt="server" AutoGenerateColumns="false" > <Columns> <asp:ImageField HeaderText="" DataField="photo" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Columns> </asp:GridView> ASP.NET

  47. Control DetailsView • Renderiza registros individuales • En conjunto con GridView para las vistas master-detail • O uso sin GridView para mostrar registros individuales • Paginado, altas, actualización y borrado incorporados • Utiliza los mismos tipos de campo que GridView • Declarado en elementos <Fields> • UI altamente personalizable ASP.NET

  48. Control DetailsView <asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select employeeid, photo, ... from employees" /> <asp:DetailsView DataSourceID="Employees" RunAt="server" AllowPaging="true" AutoGenerateRows="false" PagerSettings-Mode="NextPreviousFirstLast"> <Fields> <asp:ImageField HeaderText="" DataField="photo" /> <asp:BoundField HeaderText="Employee ID" DataField="employeeid" /> <asp:BoundField HeaderText="Date Hired" DataField="hiredate" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Fields> </asp:DetailsView> ASP.NET

  49. Alta, Actualización, y Borrado • Los controles de datos proveen UIs editables • Propiedades AutoGenerateXxxButton • Propiedades Insert/EditRowStyle • Controles de Data source proveen lógica de edición • Propiedades Insert/Update/DeleteCommand • Propiedades Insert/Update/DeleteParameters • Eventos Inserting/ed, Updating/ed, Deleting/ed ASP.NET

  50. Demo • GridView y DetailsView

More Related