![Page 1: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/1.jpg)
AJAX Development
Mike Ormond Developer & Platform GroupMicrosoft [email protected]://blogs.msdn.com/mikeormond
![Page 2: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/2.jpg)
Asynchronous
• Communication• (XMLHttpRequest)
JavaScript
• Client side processing• DHTML
XML
• Data Exchange Format• (JSON, HTML etc)
What is AJAX?
![Page 3: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/3.jpg)
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: http://developer.apple.com/internet/webcontent/xmlhttpreq.html
![Page 4: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/4.jpg)
ASP.NET AJAX ArchitectureClient Components
Server Components
![Page 5: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/5.jpg)
Server Controls
UpdatePanel
UpdateProgress
ScriptManager
ScriptManagerProxy
Timer
![Page 6: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/6.jpg)
ASP.NET AJAX ExtensionsServer Controls
![Page 7: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/7.jpg)
UpdatePanel
<asp:UpdatePanel runat="server" UpdateMode="Always | Conditional" ChildrenAsTriggers="false | true" RenderMode="Block | Inline ">
<ContentTemplate> <!-- Content Goes Here --> </ContentTemplate>
<Triggers> <asp:AsyncPostBackTrigger ControlID="SomeControl" EventName="Event1" /> <asp:PostBackTrigger "SomeControl" /> </Triggers>
</asp:UpdatePanel>
![Page 8: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/8.jpg)
UpdateProgress<asp:UpdateProgress runat="server" AssociatedUpdatePanelID="u1" DisplayAfter="500" DynamicLayout="true | false" >
<ProgressTemplate> <!-- Content Goes Here --> </ProgressTemplate>
</asp:UpdateProgress>
<asp:Timer runat="server" Enabled="true | false" Interval="500" OnTick="Handler" />
Timer
![Page 9: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/9.jpg)
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" <AuthenticationService Path="" /> <ProfileService LoadProperties="" Path="" />
<Scripts> <asp:ScriptReference Path="" /> </Scripts>
<Services> <asp:ServiceReference Path="" /> </Services>
</asp:ScriptManager>
![Page 10: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/10.jpg)
UpdatePanel Under the Covers
![Page 11: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/11.jpg)
Extender Control Framework
Enhance ASP.NET controls with client behaviors
Add to aspx to control the client behavior of a server controlHandle events from browser DOM using a behavior
Creating ExtendersCreate JavaScript File for client behaviorEither
– Inherit the ExtenderControl Abstract Class– Implement the IExtenderControl interface
![Page 12: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/12.jpg)
Control Toolkit
ClientComponents
ServerComponents
ASP.NET AJAX
Extensions
ASP.NET 2.0
ASP.NET AJAX Control Toolkit
Controls
Extenders
![Page 13: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/13.jpg)
Extender Controls
![Page 14: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/14.jpg)
Server ASMX RequirementsReference Microsoft.Web.Script.Services [ScriptService] Attribute on Class
Add [WebMethod] Attribute to Method
Web Service
Networking and ServicesAuthentication
Service
Profile Service
ASP.
NET
App
licati
on
Serv
ices
ASPX Page Method
<asp:ScriptManager runat="server" ID=“SM1"> <Services> <asp:ServiceReference path="~/WebService.asmx" /> </Services> </asp:ScriptManager>
![Page 15: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/15.jpg)
Calling Services
![Page 16: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/16.jpg)
Other Host
There’s More…
ASP.NET Futures CTP
Microsoft AJAX Library
ClientComponents
ServerComponents
ASP.NET AJAX
Extensions
ASP.NET 2.0
ASP.NET AJAX Control Toolkit
Controls
Extenders
![Page 17: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/17.jpg)
Visual Studio 2008 (Orcas)
Mike Ormond Developer & Platform GroupMicrosoft [email protected]://blogs.msdn.com/mikeormond
![Page 18: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/18.jpg)
Orcas
Multi-Targeting Support
CSS Support
DataAJAX &
JavaScript Support
![Page 19: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/19.jpg)
Orcas
![Page 20: AJAX Development Mike Ormond Developer & Platform Group Microsoft Ltd mike.ormond@microsoft.com](https://reader035.vdocuments.us/reader035/viewer/2022062421/56649d0b5503460f949deef4/html5/thumbnails/20.jpg)
© 2006 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only.MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS SUMMARY.