Ajax Examples and Demos (XMLHttpRequest)

Ajax examples (XMLHttpRequest examples), code snippets and proof of concepts - the links below should help get you started on building your own functions with XMLHttpRequest and Ajax.

Loading XML into a page with xmlHttpRequest (#)

A cool little blog post and demo that Retrieves an xml atom feed and xsl stylesheet with XMLHttpRequest().

Client Side Validation Using the XMLHTTPRequest Object (#)

An example of using XMLHTTP to perform real time data validation, in this example for validating data entered into a user registration form. The example focusses on Microsoft and ASP.

XMLHttpRequest and innerHTML (#)

XMLHttpRequest is one of modern DHTML's best kept secrets. - Haha, not anymore! Simon Willison offers up a little code that takes an HTML fragment, fetched via xmlhttp.open, and inserts it into an element with a specified id. Some good links and comments follow the article.

XMLHttpRequest, REST and the Rich User Experience : Paul James (#)

Paul James gives the basics of getting started with XMLHttpRequest and using REST for attaching the client-side to the server.

He builds an example where, upon entering a postal code and pushing a button, a form queries the server for the rest of the address information and fills in the appropriate fields when the data is returned.

Using the XML HTTP Request object (#)

Jim Ley provides his overview of the XML HTTP request object, getting into some browser details and detection before providing some examples and getting into using XMLHTTP with google's SOAP API.

Very Dynamic Web Interfaces - XMLHttpRequest (#)

Drew McLellan provides an excellent overview of the basics of using XMLHttpRequest offering up a simple, well documented example used for checking if a username is available (similar to g-mail).

XMLHttpRequest Demo (#)

Three examples of XMLHttpRequest in use: autocomplete, live search, and live action.

To Do with Ta-da List: Simple sharable to-do lists. (#)

A free web based to-do list application provided by 37Signals, makers of Basecamp. Sign-up and try it out; XMLHttpRequest in action.

XHConn - A Simple XMLHTTP Interface (#)

From the site: This library is meant to simplify and unify the code necessary to successfully send and receive simple data via XMLHTTP.

XMLHttpRequest API madness (#)

Two scripts that use XMLHttpRequest: 1 - a javaScript interface to the languid.cantbedone.org API and 2 - a javaScript interface to the del.icio.us API.

Dynamic HTML and XML: The XMLHttpRequest Object (#)

Apples page on the the XMLHttpRequest object, covering object creation, methods and properties in addition to security issues. They build an example for reading XML data, by retrieving iTunes RSS feeds that you select from a dropdown menu.

LiveSearch - Bitflux Blog Wiki (#)

The wiki page for the livesearch function. From the page: On the client side, we use XMLHttpRequest for sending the request to the server. There we have a little PHP script, which returns a small HTML file (http://blog.bitflux.ch/livesearch.php?s=PHP ) . This is then inserted into the page with some DOM manipulation.

Google Suggest feature with ASP.NET 2.0 (#)

This article provides an ASP.NET 2.0 angle of Google Suggest along with a short little look at the history of javascript, frames, remote scripting and XmlHttp + XMLHttpRequest.

A nice overview of the history and a good breakdown how the Suggest feature works.

SAJAX - Simple Ajax / xmlHTTPRequest Toolkit for PHP (#)

From the site: Sajax makes it easy to call PHP functions from your webpages via JavaScript without performing a browser refresh. Worth checking out and having a play with.

Amazon Zuggest (#)

From the site: This is my take on Google Suggest only with Amazon so I've called it "Amazon Zuggest". Head on over and give this a try.

Francis writes "The Javascript runs in the browser and fires every so often, looks for something to search on, it shoots a request using XMLHttp to my webserver, which in turn creates a SOAP message that gets sent to Amazon. They send back the content and it's formatted on the server, then streamed to the browser. All in the blink of an eye.

This is a cool little app. When you are done searching, have a hover over the "History" list in the left hand column... The site comes up a little messy in Firefox...

Instant Edit (#)

Manolo Guerrero sets up a little app that allows you to click on a form field and edit the text, which is automatically saved to the server via xmlHttpRequest. Worth a look, though the commented Javascript is in Spanish.

AJaX for weblogs (#)

A neat little script to play with (not sure what it has to do with weblogs especially tho). From the site: It uses Javascript to get data from a remote source and then loads that into a specified target. Whatever content you like to wherever you like on the page.

AJAX Login System Demo (#)

A proof of concept, Ajax based login script that, in this case, uses a php/mysql backend. The author provides all of the scripts involved and lists some advantages and dis-advantages of his method.

Usable XMLHttpRequest in Practice (#)

Thomas Baekdal gets back into accessibility and Ajax. From the site: Let's look at what we can do to turn an otherwise user-hostile XMLHttpRequest application - into a usable one.... An excellent write-up.

XHTML live Chat via XMLHttpRequest (#)

An excellent proof of concept and something I was waiting for someone to code up ;-). This XHTML live Chat uses XMLHttpRequest to post chat messages and to periodically check the server for new messages and update your chat window.

This is simply a proof of concept, and would work really well in a blog commenting setting or for forums when those fast threads start happening.

Ripped Tickets - Live Search (#)

Here's an excellent application of the livesearch idea that has been seen around the web. Type in your search (a band name) and the results show up in a nice table below the search box.

Running XMLHttpRequest with Java on Google's API (#)

Similar to other livesearch functions out there, only this one plugs into Google's API and has a Java backend, returning a list of results and descriptions for your query.

SproutLiner (#)

From the site: Sproutliner is a free web service that helps you manage your projects and ideas. This tool looks to be very promising, and to be honest you have to try it out to 'get it'. It is a sort of Ta-da list on steroids, so to speak, in that it is very simple yet a user can add to it and tailor it to their needs.

Very cool...

forgetfoo - HoverSmack() and Webservices (#)

Whenever I came across forgetfoo I was always amazed at the scripting being done on that site. This blog post outlines some very cool tricks using xmlHttpRequest. Be sure also to click on the comments (bottom) and the calendar (top).

The Fonz uses XmlHttpRequest and AJAX to spy on you. (#)

While makaing some excellent points in the article, the little adventure game "The Search For Fonzie’s Treasure" built using Ajax technologies is pretty cool. The author discusses user profiling as an "evil use" of Ajax. I'm not so sure that I would say that it is evil...

Backbase - Rich Internet Applications (#)

A very impressive piece of Ajax work, with some context provided here. Have a click thru the site and try out that back-button. Also be sure to head in and check out the demo section.

Check out the Resource categories for older content

The latest from my personal website,
Mike Papageorge.com

SiteUptime Web Site Monitoring Service

Sitepoint's web devlopment books have helped me out on many occasions both for finding a quick solution to a problem but also to level out my knowlegde in weaker areas (JavaScript, I'm looking at you!). I am recommending the following titles from my bookshelf:

The Principles Of Successful Freelancing

I started freelancing by diving in head first and getting on with it. Many years and a lot of experience later I was still able to take away some gems from this book, and there are plenty I wish I had thought of beforehand. If you are new to freelancing and have a lot of questions (or maybe don't know what questions to ask!) do yourself a favor and at least check out the sample chapters.

The Art & Science Of JavaScript

The author line-up for this book says it all. 7 excellent developers show you how to get your JavaScript coding up to speed with 7 chapters of great theory, code and examples. Metaprogramming with JavaScript (chapter 5 from Dan Webb) really helped me iron out some things I was missing about JavaScript. That said each chapter really helped me to develop my JavaScript skills beyond simple Ajax calls and html insertion with libs like JQuery.

The PHP Anthology: 101 Essential Tips, Tricks & Hacks

Like the other books listed here, this provides a great reference for the PHP developer looking to have the right answers from the right people at their fingertips. I tend to pull this off the shelf when I need to delve into new territory and usually find a workable solution to keep development moving. This only needs to happen once and you recoup the price of the book in time saved from having to develop the solution or find the right pattern for getting the job done..