Page 1
© r
aon
a 2
00
6
Microsoft AJAX Library. ASP.NET 2.0 AJAX Extensions
www.raona.com www.raona.com
Tel. 351.414.78.13Tel. 351.414.78.13
Carlos ZaniniCarlos [email protected] @raona.comRaonaRaonahttp://www.carloszanini.com.arhttp://www.carloszanini.com.ar
Page 2
2by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AgendaAgenda
• AJAXAJAX• Qué es?Qué es?• Cómo funciona? EjemplosCómo funciona? Ejemplos• EvoluciónEvolución
• AJAX con MicrosoftAJAX con Microsoft• ATLAS. MS AJAX Library. AJAX ATLAS. MS AJAX Library. AJAX
ExtensionsExtensions• Roadmap / GoalsRoadmap / Goals• ArquitecturaArquitectura• ControlesControles
• ASP.NET AJAX Control ToolkitASP.NET AJAX Control Toolkit• Más controles..Más controles..
• Recursos, referenciasRecursos, referencias
Page 3
3by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX – ¿Qué es?AJAX – ¿Qué es?
• Asynchronous JavaScript and Asynchronous JavaScript and XMLXML
• Combina Combina DHTMLDHTML, , JavaScriptJavaScript y y XmlHttpXmlHttp
• Soportado en IE, Firefox, Mozilla, Soportado en IE, Firefox, Mozilla, Opera, Safari, Konqueror, etc.Opera, Safari, Konqueror, etc.
• Mejora la Mejora la performanceperformance de las de las aplicaciones Webs. Refresca partes aplicaciones Webs. Refresca partes de una página y no toda.de una página y no toda.
• Ejemplos? mail.google.com, Ejemplos? mail.google.com, www.live.comwww.live.com
Page 4
4by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX – DEMOAJAX – DEMO
AJAX SimpleAJAX Simple
Page 5
5by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX - EvoluciónAJAX - Evolución
•IFRAME (1996) / LAYER (1997)IFRAME (1996) / LAYER (1997)•Remote Scripting (1998)Remote Scripting (1998)
• IE4, NS4IE4, NS4•Flash 4Flash 4•XmlHttpRequest (2000)XmlHttpRequest (2000)
• IE5, Outlook Web AccessIE5, Outlook Web Access• Safari, Opera (2002)Safari, Opera (2002)
•W3c (World Wide Web W3c (World Wide Web Consortium)Consortium)
• Publicó un Draft “The Publicó un Draft “The XMLHttpRequest Object” (27 Sept XMLHttpRequest Object” (27 Sept 2006)2006)
•Ajax Push (Comet, fJax …)Ajax Push (Comet, fJax …)
Page 6
6by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX con MicrosoftAJAX con Microsoft
• Ajax.Net / ProfessionalAjax.Net / Professional• ComfortASP.NETComfortASP.NET• MagicAJAX.NETMagicAJAX.NET• ZumiPageZumiPage• FastPageFastPage• ASP.NET 2.0 CallbacksASP.NET 2.0 Callbacks• ATLAS (Sept 2005)ATLAS (Sept 2005)• … …• ATLAS (CTP July 2006)ATLAS (CTP July 2006)
• Go-Live licenseGo-Live license
Page 7
7by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX con Microsoft - RoadmapAJAX con Microsoft - Roadmap
• Versión 1.0 a fin de añoVersión 1.0 a fin de año
• Beta, Release Candidate, RTMBeta, Release Candidate, RTM
• Componentes que permiten a Componentes que permiten a desarrolladores construir desarrolladores construir controles/componentes client-side.controles/componentes client-side.
• Funcionalidad server-side que Funcionalidad server-side que proveerá integración con ASP.NETproveerá integración con ASP.NET
• Fully-supported 1.0 releaseFully-supported 1.0 release
• Soporte de distintos BrowsersSoporte de distintos Browsers
Page 8
8by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
Microsoft AJAX Library - ArquitecturaMicrosoft AJAX Library - ArquitecturaWeb ServerWeb Server
IE
Firefox
Safari
BrowseBrowserr
ClientsClientsMicrosoft AJAX Microsoft AJAX
LibraryLibrary
AtlasUIGlitz.js
AtlasGadgets.js
AtlasFX.js
AtlasCompat.js
AtlasRuntime.js
JSON Bridge Support
Membership and Personalization
Support
ASP.NET Server Control Integration
IIS and ASP.NETIIS and ASP.NET
Apache and PHPApache and PHP
ColdFusionColdFusion
ASP.NET 2.0 AJAX ASP.NET 2.0 AJAX ExtensionsExtensions
ASP.NET AJAX ASP.NET AJAX Control ToolkitControl Toolkit
Page 9
9by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
ASP.NET 2.0 AJAX Extensions - ArquitecturaASP.NET 2.0 AJAX Extensions - Arquitectura
ASP.NETASP.NET
Application Services
Application Services
Page Framework,
Server Controls
Page Framework,
Server Controls
Microsoft AJAX LibraryMicrosoft AJAX Library
Client Application
Services
Client Application
Services
Component/UI
Framework,Controls
Component/UI
Framework,Controls
BrowserBrowser
PresentationPresentation(HTML/CSS)(HTML/CSS)
PresentationPresentation(HTML/CSS)(HTML/CSS)
ASP.NET ApplicationASP.NET
Application
PagesPagesPagesPages
UI BehaviorUI Behavior(Managed(Managed
Code)Code)
UI BehaviorUI Behavior(Managed(Managed
Code)Code)
Input Data
Updated UI + Behavior
Initial Rendering
(UI + Behavior)
Page 10
10by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
ASP.NET 2.0 AJAX Extensions – Server ControlsASP.NET 2.0 AJAX Extensions – Server Controls
• Mejora aplicaciones ASP.NETMejora aplicaciones ASP.NET• La lógica sigue estando del lado del La lógica sigue estando del lado del
servidorservidor• No es necesario ser un genio de JavaScriptNo es necesario ser un genio de JavaScript
• Técnicas AJAX reducen tráficoTécnicas AJAX reducen tráfico• Permite refresco parcial de una páginaPermite refresco parcial de una página• Edición de datos, validación de Edición de datos, validación de
formularios, refresco automático..formularios, refresco automático..
• Interacción enriquecida con controles Interacción enriquecida con controles
ASP.NET existentesASP.NET existentes• Se extienden los controles para el soporte Se extienden los controles para el soporte
de AJAXde AJAX• Mismos controles, modelo de objetos y Mismos controles, modelo de objetos y
eventos que ya conocemoseventos que ya conocemos• Auto-completion, web parts, drag-and-Auto-completion, web parts, drag-and-
drop, etcdrop, etc
Page 11
11by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX con Microsoft - ControlesAJAX con Microsoft - Controles
• ScriptManagerScriptManager
• Coordina el render de la página Coordina el render de la página para controles del servidorpara controles del servidor
• Envía al cliente los scripts (JS) Envía al cliente los scripts (JS) apropiados, dependiendo del apropiados, dependiendo del browserbrowser
<atlas:ScriptManager ID="scriptManager" <atlas:ScriptManager ID="scriptManager" EnablePartialRendering="true" runat="server" />EnablePartialRendering="true" runat="server" />
Page 12
12by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX con Microsoft - ControlesAJAX con Microsoft - Controles
• UpdatePanelUpdatePanel• Control estrella Control estrella • Permite actualizar regiones dentro Permite actualizar regiones dentro
de una páginade una página
Algunos controles que no se actualizarán ..
<atlas:UpdatePanel id=“u1” runat=“server”> <ContentTemplate>
Estos controles se actualizan dinámicamente <asp:calendar id=“cal1” runat=“server”/>
<ContentTemplate></atlas:UpdatePanel>
Más contenido o controles que no se actualizarán ..
Page 13
13by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
ScriptManager & UpdatePanel – DEMOScriptManager & UpdatePanel – DEMO
ScriptManager & ScriptManager & UpdatePanelUpdatePanel
Page 14
14by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
AJAX con Microsoft - ControlesAJAX con Microsoft - Controles
• AutoCompleteExtenderAutoCompleteExtender• Google-suggest styleGoogle-suggest style• Soporta Web Services de .NETSoporta Web Services de .NET
• DragOverlayExtenderDragOverlayExtender• Drag & Drop de controlesDrag & Drop de controles
• ProfileScriptServiceProfileScriptService• Soporte AJAX de ProfileSoporte AJAX de Profile
• InitialDataInitialData• Carga inicial de datosCarga inicial de datos
• TimerControl, WebPartManager, TimerControl, WebPartManager, WebPartZone, Gadget, WebPartZone, Gadget, UpdateProgress..UpdateProgress..
Page 15
15by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
DEMODEMO
Mas controles..Mas controles..
Page 16
16by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
ASP.NET AJAX Control Toolkit – Qué es?ASP.NET AJAX Control Toolkit – Qué es?
• Librería de controles ASP.NET Librería de controles ASP.NET con soporte AJAXcon soporte AJAX
• Contribuyen desarrolladores que Contribuyen desarrolladores que no trabajan en Microsoftno trabajan en Microsoft
• Código fuente liberadoCódigo fuente liberado
• Antes de fin de año se espera Antes de fin de año se espera tener 50 controlestener 50 controles
Page 17
17by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
ASP.NET AJAX Control Toolkit – ControlesASP.NET AJAX Control Toolkit – Controles
• AccordionAccordion• AlwaysVisibleControlAlwaysVisibleControl• AnimationAnimation• CascadingDropDownCascadingDropDown• CollapsiblePanelCollapsiblePanel• ConfirmButtonConfirmButton• DragPanelDragPanel• DropShadowDropShadow• DynamicPopulateDynamicPopulate• FileredTextBoxFileredTextBox• … …
Page 18
18by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
Back button !!Back button !!
• Soporte de Back Button en Soporte de Back Button en UpdatePanelUpdatePanel
• Desarrollado por el Arquitecto del Desarrollado por el Arquitecto del equipo “Web Platform and Tools” equipo “Web Platform and Tools” de Microsoftde Microsoft
• Simula mediante bookmarks las Simula mediante bookmarks las páginas anteriorespáginas anteriores
• Mejora aún más la experiencia del Mejora aún más la experiencia del usuariousuario
•
Page 19
19by
Microsoft AJAX Library. ASP.NET 2.0 AJAX Microsoft AJAX Library. ASP.NET 2.0 AJAX ExtensionsExtensions
Recursos, referenciasRecursos, referencias
ASP.NET AJAX Web SiteASP.NET AJAX Web Site• http://ajax.asp.net/http://ajax.asp.net/
BlogsBlogs• http://ajax.asp.net/Roller/default.aspx?http://ajax.asp.net/Roller/default.aspx?
tabindex=0&mid=474tabindex=0&mid=474
Atlas Control ToolkitAtlas Control Toolkit• http://ajax.asp.net/default.aspx?http://ajax.asp.net/default.aspx?
tabid=47&subtabid=477tabid=47&subtabid=477
Documentación de AtlasDocumentación de Atlas• http://ajax.asp.net/docs/Default.aspxhttp://ajax.asp.net/docs/Default.aspx
Page 20
© r
aon
a 2
00
6
Microsoft AJAX Library. ASP.NET 2.0 AJAX Extensions
GraciasGracias
www.raona.com www.raona.com
Tel. 902.362.918Tel. 902.362.918
Carlos ZaniniCarlos ZaniniRaonaRaonahttp://www.carloszanini.com.arhttp://www.carloszanini.com.ar