pracitcal ajax
Post on 02-Jul-2015
2.816 Views
Preview:
DESCRIPTION
TRANSCRIPT
Practical Ajax I n s i d e a n d O u t
Jack HerringtonAjax Author and Developer
Code
http://muttmansion.com/webvisions.tgz
Introduction To AJAX
Introduction To AJAX
Web Client
Web Server
Introduction To AJAX
Web Client
Web Server
Web Client
mypage.php
HTML
Introduction To AJAX
Web Client
Web Server
Web Client
mypage.php
HTML
Web Client
mypage.php mydata.php
HTMLXMLJSONText
AJAX Toolkits
Prototype
Scriptaculous
Yahoo! UI (yui)
Google Web Toolkit (GWT)
Microsoft’s ATLAS
AJAX and PHP
Web Client
mypage.php mydata.php
HTMLXMLJSONText
prototype.js
Transport Protocols
Text
HTML
XML
Javascript
TEXT Transport
<html><head><script src="prototype.js"></script></head><body><script>new Ajax.Request( 'text.txt', { method: 'get', onSuccess: function( transport ) { alert( transport.responseText ); }} );</script></body></html>
Here is some text
HTML Trasport
<html><head><script src="prototype.js"></script></head><body><div id="spot"></div><script>new Ajax.Request( 'portion.html', { method: 'get', onSuccess: function( transport ) { $('spot').innerHTML = transport.responseText; }} );</script></body></html> Here is <b>HTML</b> encoded text.
XML Transport
<html><head><script src="prototype.js"></script></head><body><script>new Ajax.Request( 'data.xml', { method: 'get', onSuccess: function( transport ) { var itemTags = transport.responseXML.getElementsByTagName( 'item' ); alert( itemTags[0].firstChild.nodeValue ); }} );</script></body></html>
<data> <item>Hello</item></data>
JSON Transport
<html><head><script src="prototype.js"></script></head><body><script>new Ajax.Request( 'data.js', { method: 'get', onSuccess: function( transport ) { alert( eval( transport.responseText ) ); }} );</script></body></html> 1+2
Tabs
Search Forms
Search Forms
Instant
Search Forms
Instant Delayed
Tables
Tables
Basic
Tables
Basic Paged
Tables
Basic Paged Hidden DIVs
Logins
Forms
Slideshows
Lightboxes
AJAX Windows
AJAX Video
Common Pitfalls
Cross protocol and cross domain problems
Timer problems
XML instead of Javascript
Too much complexity
Not respecting Javascript
Widgets
AJAX Alternatives
FLEX
Lazslo
WPFe
Resources
Ajaxian.com
IBM Developerworks AJAX articles and forum
Mozilla, MSDN and Apple
http://twitter.com/richsipe - IFRAME version of Lightbox
top related