AJAX Tutorials

  • Form Element AJAX Spinner Attachment Using MooTools

    Many times you'll see a form dynamically change available values based on the value of a form field. For example, a "State" field will change based on which Country a user selects. What annoys me about these forms is that they'll often do an AJAX request to grab the states but wont show any indicator to the user that something is happening. We're going to use MooTools to add an AJAX spinner image next to form fields that perform such AJAX requests.

  • Remotely Download Google AJAX Libraries Using PHP

    I don't know how to use all of the JavaScript libraries but perusing their code is interesting. If I'm looking to code something I'll look at how each of the other libraries accomplishes the task. The problem is that you need to go out and download each one. And of course they're all on different development schedules so you'd also need to make sure to grab the latest version of the library. Instead of manually accomplishing that task, I've chosen create a script that does all of that for me.

  • Create an “Add to TextMate” Widget Using MooTools

    If a sword is a soldier's best friend, the best friend of a programmer is a his text editor. TextMate has been my text editor of choice and a big reason for that is the ability to add snippets for quick use later. Since I provide a lot of snippets on my blog and many of my readers use TextMate, I've created an "Add To TextMate" widget using a mixture of MooTools, AJAX, CSS, and PHP.

  • Caching AJAX Results in JavaScript

    AJAX is an awesome tool. AJAX requests are usually faster than regular page loads and allow for a wealth of dynamism within a page. Unfortunately many people do not properly cache request information when they can. Let me show you how I cache AJAX requests — it's super easy!

  • Detect an AJAX Request in PHP

    I like using the same PHP script for both AJAX and non-AJAX content requests. Using one script just makes everything easier because it's only one file to update/edit and it's one more cache-able request. One way to try detect an AJAX request (as opposed to a regular page load) is by using the following PHP code:

  • JavaScript’s window.location Object

    Need current browser location information?  Keep in mind that the JavaScript's window.location object gives you all of that information about the window's current location.

  • Introducing MooTools ScrollSpy

    I've been excited to release this plugin for a long time. MooTools ScrollSpy is a unique but simple MooTools plugin that listens to page scrolling and fires events based on where the user has scrolled to in the page. Now you can fire specific functionality with just a few simple parameters.

  • #davidwalshblog AJAX Chat

    I announced a few days ago that I had created the #davidwalshblog IRC chat room on Freenode so that my readers could get in touch with me and speak with other readers. That includes getting help, giving help, and discussing web topics.

  • MooTools’ AutoCompleter Plugin

    One of the famous MooTools plugins is Harald Kirschner's AutoCompleter plugin. AutoCompleter takes a term input by the user and searches for matches — an obviously help to the user. Here's how to make the most of Harald's great plugin.

  • Animated AJAX Record Deletion Using jQuery

    I'm a huge fan of WordPress' method of individual article deletion. You click the delete link, the menu item animates red, and the item disappears. Here's how to achieve that functionality with jQuery JavaScript.