Incorporating jQuery
You can add a layer of Ajax on top of the shopping cart system in one of two ways:
- Hand-code raw JavaScript
- Tap into an existing JavaScript framework
I’ve personally done both, but these days when I want quick, reliable Ajax features, I turn to jQuery. The jQuery framework is a snap to use (once you understand the somewhat cryptic syntax) and degrades nicely. This is to say that for those unfortunate souls who can’t use the Ajax-enabled version of the system, they’ll still be able to use the non-Ajax system without a problem.
The first thing you’ll need to do is incorporate the jQuery framework into the site. You can, of course, download the framework, upload it to your server, and then use the <script> tag to add it to a page, but I’d recommend you consider using Google’s API library system instead. Here is that code, for the current version of jQuery at the time of this writing (1.4.4):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
The main benefit of using Google’s API library is speed. The jQuery framework will be provided to your site’s visitors from the closest Google server, taking advantage of Google’s CDN (Content Delivery Network). Also, if the visitor has been to another site that uses Google’s API library for jQuery, their browser should have cached the jQuery framework, meaning they won’t need to download it again.
You’ll want to add this code to every page in the site (well, every page that might involve adding an item to the shopping cart), so it would logically go in the site’s header file, assuming there is one.