ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated...
-
Upload
quentin-gilbert -
Category
Documents
-
view
212 -
download
0
Transcript of ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated...
![Page 1: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/1.jpg)
ASP.NET AJAX 1
ASP.NET AJAX
![Page 2: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/2.jpg)
ASP.NET AJAX 2
Ordinary web applications vs. AJAX
Ordinary web application• The full page is updated at
each request• The page is not available
while being updated
AJAX• A part of the page can be
updated• The page is available while
being updated• Better responsiveness• Flicker-free• More like ordinary Windows
application• Rich Internet Applications
(RIA)
![Page 3: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/3.jpg)
ASP.NET AJAX 3
Some web sites using AJAX
• http://www.dr.dk/Sporten/dongbold/– Results of live sport events– Only parts of the page is
updated
• http://www.google.com/– Auto complete user input
![Page 4: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/4.jpg)
ASP.NET AJAX 4
AJAX general architecture
• AJAX means– Asynchronous JavaScript and
XML
• Server generates– HTML– JavaScript
• Client-side AJAX engine sends– Request to Server side– Response is XML
• From web service
• Figure from www.openajax.org
![Page 5: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/5.jpg)
ASP.NET AJAX 5
ASP.NET AJAX
Figure from http://msdn.microsoft.com/en-us/library/bb398874%28VS.90%29.aspx
![Page 6: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/6.jpg)
ASP.NET AJAX 6
Some ASP.NET server side controls
• ScriptManager– Any ASP.NET page wishing to use AJAX must
include a ScriptManagerControl• UpdatePanel– A panel for partial-page update
• Timer– Makes post back at defined intervals– Used with UpdatePanel to perform periodic
partial-page updates
![Page 7: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/7.jpg)
ASP.NET AJAX 7
ASP.NET AJAX client support
• Browser capability– Generates JavaScript for some browsers• Internet Explorer, Firefox, Apple Safari
• Extends JavaScript– Classes, name spaces, data types, object
serialization, etc.• Network layer– Supports communication with web services
![Page 8: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/8.jpg)
ASP.NET AJAX 8
ASP.NET AJAX examples
• Partial-page update– AJAXORama: DataTimeUpdate.aspx– Example: AjaxLookUpCity
• Timer based partial-page update– AJAXORama: GroupChatAgain.asp
![Page 9: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/9.jpg)
ASP.NET AJAX 9
ASP.NET Web services
• Using AJAX you can call web service methods on the server side.
• Web services normally use HTTP for transportation– The payload is an XML document
![Page 10: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/10.jpg)
ASP.NET AJAX 10
ASP.NET AJAX control kit• Huge collection of controls– Most are JavaScript versions of ASP.NET server controls
• Not included in Microsoft Visual Studio• Download from– http://www.asp.net/ajaxlibrary/act.ashx
• Example components– AutoComplete
• Extends to TextBox• Uses web services to list possible text entries, based on what’s
already in the text box• Example: AJAXORama: autoCompleteFromDatabase.aspx
![Page 11: ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.](https://reader036.fdocuments.us/reader036/viewer/2022072011/56649e355503460f94b24689/html5/thumbnails/11.jpg)
ASP.NET AJAX 11
References and further readings• George Shepherd ASP.NET Step by Step, Microsoft
Press 2010– Chapter 23 AJAX, page 473-512
• Imar Spaanjaars Beginning ASP.NET 4.0, Wrox 2010– Chapter 10 ASP.NET AJAX, page 331-365
• Bill Evjen Professional ASP.NET 4 in C# and VB, Wrox 2010– Chapter 18 ASP.NET AJAX, page 709-745– Chapter 19 ASP.NET AJAX Control Toolkit, page 747-803
• AJAX: The Official Microsoft ASP.NET Site– http://www.asp.net/ajax