AJAX Tutorials
AJAX PHP WordPress
WordPress AJAX Comments
There are many functionalities on the web that were just begging to be AJAXified. Whether it be voting on a poll or simply commenting on a blog post, there's really no reason to reload an entire page for something so simple. This blog has featured AJAX comments in WordPress for years, but only recently did I find the most optimized way to process those comments. Here's how to handle the WordPress PHP side of AJAX comment systems.
Read Post.htaccess AJAX JavaScript jQuery Markup
IFRAME Permission Denied Solution
I was recently rolling my own AJAX upload script, posting a form to a hidden IFRAME and using the load event to know when the upload was complete. When the upload completed, I wanted to access the IFRAME content so I could verify that the upload completed successfully. Surprisingly I ran into the following JavaScript error...
Read PostAJAX JavaScript
curl.js: Incredible AMD Loader
Today there are dozens of AMD JavaScript loaders available, the most popular being RequireJS. There are also lesser known JavaScript loaders like YepNope, $script.js, LABjs, and Dojo's new native loader. My favorite JavaScript loader, however, is John Hann (unscriptable)'s curl. While allowing for maximum configuration and reliable loading, curl also allows for loading of simple JavaScript files as well as CSS files. Let me show you how to use it!
Read Post View DemoAJAX
PHP Advent 2011: Cross-Origin Ajax with CORS
I've had the honor of writing for this year's PHP Advent, blessing you all about Cross-Origin Requests with CORS...
Read PostAJAX Dojo JavaScript MooTools
JavaScript Coding with Class
I've spent the last two weeks in London, eating fish'n'chips, drinking cup'o'tea, and being a hooligan at the Arsenal. Oh yeah, there was a MooTools hackathon too. The MooTools hackathon was hugely successful and I'll be providing more detail about what was accomplished and where MooTools is going over the coming weeks. It was also great to meet some of the development team in person instead of simple IRC. MooTools FTW!
Read PostAJAX Dojo JavaScript
Custom AJAX Content Handling with the Dojo Toolkit
If you were to ask me for the top five words that should describe any JavaScript framework, one of them would be flexible. The Dojo Toolkit is ultra-flexible in just about every way, using customizable classes and
Read Postdojo-namespaced objects to to allow for maximal flexibility. One of thosedojo-namespaced objects,dojo.contentHandlers, is an object containing key->value pairs for handling the result of AJAX requests. Let me show you how to use these content handlers and how you can create your own!AJAX CSS HTML5 MooTools
Drag and Drop MooTools File Uploads
Honesty hour confession: file uploading within the web browser sucks. It just does. Like the ugly SELECT element, the file input is almost unstylable and looks different on different platforms. Add to those criticism the fact that we're all used to drag and drop operations, yet up until recently, you couldn't drag files into a browser to upload them, making file uploading within the browser unintuitive. With recent advancements in browser technology, the drag and drop method is now supported, but it doesn't look good without a bit of work. Luckily MooTools Core Developer Arian Stolwijk has created a set of classes to accommodate styling drag and drop file uploading within the browser. Let's have a look at how it works!
Read Post View DemoAJAX MooTools Optimization
Lazy Load Content and Widgets with MooTools and RequireJS
The idea of lazy loading content is not new; we've been lazy loading images (check out my MooTools LazyLoad plugin) for quite a while now. And why wouldn't you lazy load content? There are SEO advantages, load time advantages, bandwidth savings, and more, so including a bit of extra JavaScript could help your large website immensely. In my latest redesign, I took the time to lazy load not just images but static content and social networking widgets to make my website's initial load happen faster to make user experience and Google rank improve. Let me show you how I used MooTools and RequireJS to lazy load content.
Read PostAJAX JavaScript MooTools Optimization
MooTools History Plugin
One of the reasons I love AJAX technology so much is because it allows us to avoid unnecessary page loads. Why download the header, footer, and other static data multiple times if that specific data never changes? It's a waste of time, processing, and bandwidth. Unfortunately, at this point in the web, constant refreshes are the norm — but they don't have to be. Christoph Pojer, a MooTools Core Developer, has added History to his PojerTools PowerTools library. History replaces traditional same-site URL loading by providing a method to catch link clicks, load page content via AJAX (Mootools'
Read Post View DemoRequest.HTMLclass), modify the document's location object to keep "history" records, and re-evaluate content links to allow developers to create a fast, efficient one-page website.AJAX APIs CSS Markup MooTools
RealTime Stock Quotes with MooTools Request.Stocks and YQL
It goes without saying but MooTools' inheritance pattern allows for creation of small, simple classes that possess immense power. One example of that power is a class that inherits from Request, Request.JSON, and Request.JSONP: Request.Stocks. Created by Enrique Erne, this great MooTools class acts as a wrapper for Request.JSON and Yahoo!'s YQL service. Let me show you how to user Enrique's awesome MooTools JavaScript class!
Read Post View Demo