AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd

Communication (XMLHttpRequest) Asynchronous Client side processing DHTML JavaScript Data Exchange Format (JSON, HTML etc) XML What is AJAX?

XmlHttpRequest (XHR) var req; function loadXMLDoc(url) { req = false; // branch for native XMLHttpRequest object if(window.XMLHttpRequest && !(window.ActiveXObject)) { try { req = new XMLHttpRequest(); } catch(e) { req = false; } // branch for IE/Windows ActiveX version } else if(window.ActiveXObject) { try { req = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { try { req = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { req = false; } if(req) { req.onreadystatechange = processReqChange; req.open("GET", url, true); req.send(""); } function processReqChange() { // only if req shows "loaded" if (req.readyState == 4) { // only if "OK" if (req.status == 200) { //...processing statements go here... } else { alert("There was a problem retrieving the XML data:\n“ + req.statusText); } From:

ASP.NET AJAX Architecture Client Components Server Components

The AJAX Extensions Client Components Client Components Server Components Server Components ASP.NET AJAX Extensions ASP.NET 2.0 Server Controls Extender Control Framework Networking and Services Integration

Server Controls UpdatePanel UpdateProgress ScriptManager ScriptManagerProxy Timer

ASP.NET AJAX Extensions Server Controls

UpdatePanel <asp:UpdatePanel runat="server" UpdateMode="Always | Conditional" ChildrenAsTriggers="false | true" RenderMode="Block | Inline ">

UpdateProgress <asp:UpdateProgress runat="server" AssociatedUpdatePanelID="u1" DisplayAfter="500" DynamicLayout="true | false" > <asp:Timer runat="server" Enabled="true | false" Interval="500" OnTick="Handler" /> Timer

ScriptManager <asp:ScriptManager runat="server" AllowCustomErrorsRedirect="true | false" AsyncPostBackErrorMessage="Some Error Message" AsyncPostBackTimeout="500" EnablePageMethods="true | false" EnablePartialRendering="true | false“ LoadScriptsBeforeUI="true | false" ScriptMode="Auto | Debug | Inherit | Release"

UpdatePanel Under the Covers Client script processes “delta” response Updates rendering with new markup Server processes a regular post-back Same page lifecycle, post-back processing Only render content of UpdatePanels needing update Client script suppresses normal form submit Simulates post-back via XMLHttpRequest All form fields, including view state

Script Core Core Script Framework Classes and interfaces Inheritance Virtual methods Multi-cast event handlers similar to.NET Enumerations Abstract methods Base Class Library StringbuilderSerializer Debugging & Tracing Networking Browser Compatibility Safari Firefox Opera IE

Working With Types Use methods on the ‘Type’ Class Type.registerNamespace Type.registerClass Type.registerInterface

Extender Control Framework Enhance ASP.NET controls with client behaviors Add to aspx to control the client behavior of a server control Handle events from browser DOM using a behavior Creating Extenders Create JavaScript File for client behavior Either –Inherit the ExtenderControl Abstract Class –Implement the IExtenderControl interface

Control Toolkit Client Components Client Components Server Components Server Components ASP.NET AJAX Extensions ASP.NET 2.0 ASP.NET AJAX Control Toolkit Controls Extenders

Extender Controls

Server ASMX Requirements Reference Microsoft.Web.Script.Services [ScriptService] Attribute on Class Add [WebMethod] Attribute to Method Web Service Networking and Services Authentication Service Profile Service ASP.NET Application Services ASPX Page Method

Calling Services

Other Host There’s More… ASP.NET Futures CTP Microsoft AJAX Library Client Components Client Components Server Components Server Components ASP.NET AJAX Extensions ASP.NET 2.0 ASP.NET AJAX Control Toolkit Controls Extenders

Visual Studio 2008 (Orcas) Mike Ormond Developer & Platform Group Microsoft Ltd

Orcas Multi- Targeting Support CSS SupportData AJAX & JavaScript Support

Orcas

© 2006 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS SUMMARY.