Publishers of technology books, eBooks, and videos for creative people

Home > Articles

  • Print
  • + Share This
From the author of Understanding the Non-Ajax Version

Understanding the Non-Ajax Version

The first thing you’ll need to do is make sure you have a proper non-Ajax version of the tasks at hand. There are two reasons for doing so:

  • First, it gives you, the developer, the chance to create the entire, fully functioning system without the confusion of Ajax (Ajax can make debugging harder).
  • Second, the correct way to use Ajax—and JavaScript in general—is so that it degrades gracefully. This means that should the user’s browser support the Ajax feature, Ajax will be used; should the user’s browser not support Ajax, the non-Ajax version will be used automatically.

In either case, the user shouldn’t know that the alternative approach even existed.

Rather than come up with a new example, I’ve decided to build off of the second e-commerce project from my book (see the earlier link). You can view the site in a demo mode (without the modifications discussed in this article). If you have an existing e-commerce site, you can probably use it as your basis for Ajax expansion per the instructions to follow.

The non-Ajax version of the shopping cart on that site uses one script—cart.php—for all things related to the shopping cart. To add a new product to the cart, the script needs to receive a SKU and an action value in the URL:

http://www.example.com/cart.php?sku=C249&action=add

Any page that allows for an item to be added to the shopping cart, such as one that displays a product or lists sale items, just creates a link like that.

Once you have all this working for your e-commerce site, you can “Ajax-ify” it.

  • + Share This
  • 🔖 Save To Your Account