Embed Size (px)
Citation preview
Curso ASP.NetUnivisit.com SA de CV
I. Introducción al ASP.Net.II. Agregando y configurando Server ControlsIII. Validando Entradas y Navegación del Sitio.IV. Administración del Estado en ASP.NETV. Personalizando una Aplicación Web.VI. Trabajando con Ajax y Scripts del lado del
clienteVII.Trabajando con JQueryVIII.Introducción a Transact-SQL ProgrammingIX. Usando ADO.NET, XML y LINQ
Contenido
X. Trabajando Con DataSource y DataBound Controls.
XI. Trabajando Con serviciosXII.Trabajando con User Control.XIII.Programando la Aplicación WebXIV.Globalización y Accesibilidad.XV.Implementando User profile, Autenficacion y
Autorización XVI.Configurando Cache en las Aplicaciones Web.XVII.Trabajando con XSLT, XSD y XML.
Contenido
Entendiendo la interacción entre el Cliente y Servidor
Introducción a HTML. Introducción al protocolo HTTP. Crear un WebSite y Paginas ASPX Trabajar Con Archivos de Configuración
Web.Config.
I. Introducción al ASP.Net
1. El usuario usa su Navegador para iniciar una petición a un recurso del servidor web.
2. El protocolo HTTP es usado para enviar una petición GET al servidor Web.3. El servidor web procesa la petición GET en el servidor.4. El servidor Web envía una respuesta al Navegador con el protocolo HTTP.5. El Navegador web entonces procesa la respuesta(HTML y JS) y dibuja la
pagina web para mostrarla al usuario.6. El usuario entonces debe introducir los datos y realizar una acción tal como un
clic a un botón Submit. Esto causara que los datos se envíen al servidor web para ser procesados .
7. El Protocolo HTTP es usado para enviar un POST de los datos al web server.8. El servidor Web procesa la petición POST llamando el código del recurso
solicitado9. El servidor web envía una respuesta al Navegador usando el protocolo HTTP10. El Navegador procesa la respuesta para ser presentada al usuario.
Entendiendo la interacción entre el Cliente y Servidor
Peticion y Respuesta Simple
Proveedor de una Plataforma independiente Desplegar imágenes Solicitar Paginas Web Trabajar Con Scripts y AJAX
Navegador Web
HTTP es el protocolo de comunicación basado en texto que es usado para pedir paginas Web al Servidor y enviar respuestas desde el servidor Web al navegador web. Los mensajes HTTP son enviados a través del puerto 80 o usando seguridad por el puerto 443 HTTP(HTTPS).
Entendiendo HTTP
GET /default.aspx HTTP/1.1Host: www.northwindtraders.com
Ejemplo Método HTTP
OPTIONS. Lista de metodos soportados GET. Obtiene un recurso del servidor. HEAD. Recupera Metainformacion POST.envia datos a el servidor web a una pagina web
para que sean procesados en el servidor. PUT Permite Crear un Recurso en el servidor a traves de
una URL DELETE. Usado para borrar un recurso en servidor web. TRACE. Usado para probar o diagnosticar CONNECT. Utilizado para hacer un tunel de
comunucacion tales como SSL.
Metodos HTTP
HTTP/1.1 200 OKServer: Microsoft-IIS/6.0Content-Type: text/htmlContent-Length: 38<html><body>Hello, world.</body><html>
Respuesta HTTP
1xx Informational: Petición Recibida 2xx Success: la acción fue satisfactoria. 3xx Redirect Command: alguna acción
debe ser tomada en este error. 4xx Client Error: error de sintaxis o el
servidor no sabe como procesar la petición 5xx Server Error: Fallo en el servidor.
STATUS CODE GROUP
100 Continue 200 OK 201 Created 300 Multiple Choices 301 Moved Permanently 302 Found 400 Bad Request 401 Unauthorized 403 Forbidden 404 Not Found 407 Proxy Authentication Required 408 Request Time-out 413 Request Entity Too Large 500 Internal Server Error 501 Not Implemented
STATUS CODE
Text. Informacion Textual Image. Datos de imagen. Audio. Datos de Audio. Video. Datos de Video. Application. Otra clase de datos como
archivos Binarios
MIME TYPE
<form method="POST" action="getCustomer.aspx">Enter Customer ID:<input type="text" name="Id"><input type="submit" value="Get Customer"></form>
GET /getCustomer.aspx?Id=123&color=blue HTTP/1.1Host: www.northwindtraders.com
POST /getCustomer.aspx HTTP/1.1Host: www.northwindtraders.comId=123&color=blue
Enviando datos de un formulario al servidor web
File System Local IIS FTP HTTP
Crear un Web Site en ASP.NET
App_Browsers. Contiene archivos de definicion de navegadores (.browser) ASP.NET
App_Code. Contiene codigo de clases y objetos de negocio (.cs,.vb, and .jsl files)
App_Data. Contiene archivos de datos de la aplicacion (.mdf and .xml files). App_GlobalResources. Contiene los recursos de la aplicacion (.resx
and .resources files) App_LocalResources. Contiene recursos de paginas especificas App_Themes. Contiene carpetas de cada teman or look para tu sitio. Un
tema consiste de archivos (,skin, .css, e imagenes) App_WebReferences Contiene arhivos de referencias web
(.wsdl, .xsd, .disco y .discomap ). Bin. Carpeta que contiene los archivos de ensamblados de la
aplicacion(DLL).
Contenido de los Sitios Web
* Directivas Page.* Code.* Page Layout.
<%@ Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server">private void OnSubmit(Object sender, EventArgs args) {
LabelReponse.Text = "Hello " + TextBoxName.Text;}</script><!--page layout--><head runat="server"></head><body><form id="form1" runat="server"><div>Enter Name: <asp:TextBox ID="TextBoxName"runat="server"></asp:TextBox><asp:Button ID="ButtonSubmit" runat="server" Text="Submit"OnClick="OnSubmit" /><asp:Label ID="LabelReponse"runat="server" Text=""></asp:Label></div></form></body></html>
Paginas ASPX
* Single File* Codigo Behind
Modelos de Programación en ASP.NET
Trabajando con Archivos de Configuración Web.config
Entendiendo el Ciclo de vida de una página web
Diferencia entre controles HTML, HTML Server Controls y Web Controls
Controles comunes “Common Server Controls”
Controles Especializados “Specialized Server Controls”
II. Agregando y Configurando Server Controls
Entendiendo el Ciclo de vida de una página web
PreInit. Primer evento que se lanza de la pagina web Init. Se dispara después de que cada control se ha inicializado InitComplete. Se lanza depuse que todo se haya inicializado Preload. Se lanza antes de que el viewstate se haya cargado Load. Cuando todo se ha inicializado en la pagina Control (PostBack) Event(s). Eventos de los controles que hicieron
postback. LoadComplete. Todos los controles son cargados y procesados PreRender. Se lanza después del postback y antes que se salve el
viewstate SaveStateComplete. Después de que el viewstate se salvo Render. Cuando se empieza a generar la respuesta HTML Unload. Este evento se lanza cuando se descargo la pagina y se
empiezan a liberar los recurso
Eventos del Ciclo de Vida de una Pagina
HTML Controls HTML Server Controls Web Server Controls
Diferencia entre HTML, HTML Server Controls y Web Server Controls
<html> <head><title>Customer Page</title></head> <body> <form name="Form1" method="post" action="update.asp" id="Form1" >
<input type="text" name="CustomerName"id="CustomerName" >
<input type="submit" name="SubmitButton“ value="Submit" id="SubmitButton" > </form> </body></html>
Página web ASP Clásica
<html> <head><title>Customer Page</title></head> <body> <form name="Form1" method="post" id="Form1" runat=”server”> <input type="text" name="CustomerName" id="CustomerName" runat=”server” > <input type="submit" name="SubmitButton" value="Submit" id="SubmitButton" runat=”server”> </form> </body></html>
Página ASP.NET
AtributesDisabledIdStyleTagNameVisible
Propiedades de los HTML Server Control
//C#protected void Page_PreInit(object sender, EventArgs e){TextBox textBoxUserName = new TextBox();TextBoxUserName.ID = "TextBoxUserName";form1.Controls.Add(textBoxUserName);}
Agregando dinámicamente Web Server Controls
AccessKey.AtributesBackColorBorderColorBorderWidthBorderStyleCssClassStyleEnabledEnabledThemingEnabledViewStateFontForeColorHeightSkynIdTabIdexToolTipWidth
Propiedades de los Web Server Control
<asp:Button ID="ButtonSave"runat="server" Text="Save"Style="position: absolute; top: 50px; left: 100px; width: 100px;" />
<input type="submit"name="ButtonSave"value="Save"id="ButtonSave"style="position: absolute; top: 50px; left: 100px; width: 100px;" />
AutoPostBack Property Colección «Controls» El Método «FindControl»
Caracteristicas Comunes de los Web Server Controls
Label Texbox Button Checkbox RadioButton
Controles comunes “Common Server Controls”
<asp:Label ID="Label1" runat="server" style="color: Blue" Text="Some Text"></asp:Label>
Label1.Text = "Some Text";
Control Label
Text. Propiedad para inicializar y obtener la entrada de datos.
TextMode. Valores: singleline, Multiline y Password
Columns y Rows. Valores para saber el alto y el ancho del control
Control TextBox
Es un control que con Click lanza un postback al servidor web.Evento ClickPropiedades CommandName CommandArgument CausesValidation
Control Button
protected void Playback_Command(object sender, CommandEventArgs e){ switch (e.CommandName) { case "Back": Response.Write("back"); break; case "Pause": Response.Write("pause"); break; case "Play": Response.Write("play"); break; case "Forward": Response.Write("forward"); break; }}
Propiedades: Text. TextAlign Checked AutoPostBack
Evento CheckedChanged
Control CheckBox
Propiedades: GroupName Text. TextAlign Checked
Evento CheckedChanged
Control RadioButton
Literal. Table, TableRow, and TableCell. Image. ImageButton. ImageMap. Calendar. FileUpload. Panel. MultiView. View. Wizard.
Controles Especializados “Specialized Server Controls”
Es un control muy similar al Control Label. La diferencia es que este no se dibuja en una etiqueta <span> y se muestra tal cual es el contenido en HTML.
Propiedad Mode:PassThrough.EncodeTransform
Literal Control
//C#protected void Page_Load(object sender, EventArgs e){Literal1.Text =@"This is an <font size=7>example</font><script>alert(""Hi"");</script>";Literal2.Text =@"This is an <font size=7>example</font><script>alert(""Hi"");</script>";Literal3.Text =@"This is an <font size=7>example</font><script>alert(""Hi"");</script>";Literal1.Mode = LiteralMode.Encode;Literal2.Mode = LiteralMode.PassThrough;Literal3.Mode = LiteralMode.Transform;}
Ejemplo literal control
Controles muy similares al tag <table>, <TR> y <TD>
Controles Table, TableRow y TableCell
Dibujado como <img> y es representado <asp:image>
Propiedades:ImageUrlAlternateTextImageAlignDescriptionUrl
Control Image
Tiene un evento Click Permite enlazar un boton con una imagen Se representa en html <input type=image> Permite capturar cordenadas X y Y
Control ImageButton
Ejemplo imageButton
Este control es usado para dar click en una parte de la imagen y hacer postback al servidor.
Se definen regiones llamadas «Hot Spots» En HTML se representa <map name=mapi>
<area>
Control ImageMap
Definen una region dentro del control ImageMapPropiedades:AccessKeyAlternateTextHotSpotmode. CircleHotSpot, RectangleHotSpot yPolygonHotSpotNavigateUrlPostBackValueTabindexTarget.
Controles Hotspot
El Control Calendar
Se utiliza para mostrar un calendario en una pagina web. <asp:calendar>
Propiedad SelectionMode. Day, DayWeek, DayWeekMonth y None
Caption. CaptionAlign CellPadding CellSpacing. DayHeaderStyle. DayNameFormat. DayStyle FirstDayOfWeek. NextMonthText NextPrevFormat NextPrevStyle. OtherMonthDayStyle. PrevMonthText. SelectedDate. SelectedDates SelectedDayStyle
Propiedades del Control Calendar
SelectionMode SelectMonthText SelectorStyle SelectWeekText ShowDayHeader ShowGridLines ShowNextPrevMonth ShowTitle TitleFormat TitleStyle TodayDayStyle TodaysDate UseAccessibleHeader VisibleDate. WeekendDayStyle
Usado para subir archivos a el servidor <input type=file>
Propieades FileBytes FileContent PostedFile
Control FileUpLoad
Es un contenedor para agrupar controles y poder trabajar con ellos en una región.
Control Panel
Son contenedores al igual que el control Panel y se utilizan cuando queremos administrar mejor un multiconedor.
Propiedades: ActiveIndex.Metodo SetActiveView
Controles MultiView y View
Es un control que nos sirve para desplegar una serie pasos y capturar entradas de datos.
Tiene una colección de Controles WizardStep .
Propiedad StepType. WizardStepType.Auto, WizardStepType.Complete, WizardStepType.Finish, WizardStepType.Start, WizardStepType.Step.
El Control Wizard
Es usado para desplegar un contenido de un documento XML
Propiedades DocumentSource. Especifica la localizacion del
archivo xml DocumentContent. Acepta una cadena que
contiene el contenido XML. TrasformSource. Establece la ubicación de una
hoja de transformacion del documento XSL
Control XML
//C#public partial class XmlControlVb : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){Xml1.DocumentSource = "App_Data/ProductList.xml";Xml1.TransformSource = "App_Data/ProductList.xsl";}}
Ejemplo Control XML
Entendiendo el framework de validación Navegación del sitio Usando el SiteMap Server Control
III. Validando Entradas y Navegación del Web Site
Nos sirve para ayudarnos a asegurar la entrada de los datos por el usuario cuando haga un Submit o cambie el Focus del control
Nos provee validación tanto del lado del cliente como del servidor.
La validación del lado del servidor se hace a través de la propiedad Page.IsValid.
La validación de lado del cliente se hace a través de scripts enviados desde el servidor, siempre y cuando la propiedad EnabledClientScript este en «True».
Podemos determinar en un botón submit cuando queremos hacer validación o no con la propiedad del botón «CauseValidation»
Podemos agrupar validaciones por medio de la propiedad «ValidationGroup» para no validar páginas enteras y solo un parte
Entendiendo el Framework de validación
ControlToValidate Display EnableClientSideScript ErrorMessage IsValid Enabled Type. (Solo a los CompareValidators)
Propiedades de los Controles de Validación.
Nos sirve para asegurarnos de que el usuario nos de una entrada requerida.
Propiedad InitialValue. Usada cuando el control tiene un valor inicial y que se cambie el valor
Control RequiredField Validator
Es usado para realizar validaciones usando operadores de comparación como >, >=, =, < , <= con la propiedad Operator
También es usado para dar entradas para un control con un tipo de datos requerido
Propiedad Type = DataTypeCheck Propiedad ValueToCompare para comparar con
una constate de cualquier tipo de dato Propiedad ControlToCompare define otro control
que se usara para realizar la comparación.
Control CompareValidator
Nos sirve para realizar validaciones de valores en un rango.
Propiedades MinimumValue y MaximumValue
Control RangeValidator
Nos Sirve para Validar una Expresión Regular la cual es provista por un lenguaje de patrones.
Propiedad ValidationExpression. Establece una expresión regular para validar coincidencias con valores a esta expresión.
Control RegularExpression
Se utiliza para proveernos de otras formas de validación propias basadas en codificaciones hechas por nosotros mismos..
Propiedad ClientValidationFunction. Validación del lado del servidor. Evento
ServerValidate del control CustomValidator
Control CustomValidator
Despliega un resumen de los errores que tienen los controles de validación de la página en alguna parte de la página después de que el usuario hizo un Submit.
Puede ser configurado con un popup message
Control ValidationSummary
Client-side Navegation. Cross-page Posting. Client-Side Browser Redirect. Server-Side transfer.
Navegación del sitio
Lo podemos hacer mediante el control <asp:Hyperlink<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/NavigateTest2.aspx">Goto NavigateTest2</asp:HyperLink>HTML<a id="HyperLink1" href="NavigateTest2.aspx">Goto NavigateTest2</a>
Lo podemos hacer con javascript con la propiedad location del objeto window o document<a id="HyperLink1" href="NavigateTest2.aspx">Goto NavigateTest2</a>
<script language="javascript" type="text/javascript">function Button1_onclick() {document.location="NavigateTest2.aspx";}</script>
Client-Side Navegation
Se utiliza cuando capturamos datos en una página web y los procesamos en otra.
Propiedad del Control Button PostBackUrl. Propiedad de la página web
Page.PreviousPage
Cross-Page Posting
Se utiliza en los casos cuando queremos redireccionar a una página desde lado del servidor haciendo un RoundTrip.
Utilizamos el metodo redirect del objeto response. Response.Redirect(«URL»);
Client-Side Browser Redirect
Se utiliza en los casos cuando en una página se capturan los datos y pasamos el proceso de los datos a otra página.
Se utiliza el método Transfer del objeto Server. Server.Transfer(«URL»)
Server-Side Transfer
Un Site Map es un archivo XML que nos ayuda a establecer una estructura jerárquica y nos facilita la administración de la navegación en nuestro sitio. Sitemap.xml
Al trabajar con ella nos da una clase global llamada Sitemap la cual podemos obtener los valores de cada node que representan una Navegación URL de nuestro website.
protected void Button1_Click(object sender, EventArgs e){Response.Redirect(SiteMap.CurrentNode.ParentNode.Url);}
Usando el Site Map Server Control
El Control SiteMapDataSource. Diseñado para obtener el acceso al archivo site map.
Controles de visualización: Menu, TreeView y SiteMapPath.
Desplegando Información del Site Map a los usuarios
