Table of Contents
AJAX is a buzz word which stands for “Asynchronize JavaScript and XML”. AJAX brings new web application experience to users with better look and feel and desktop-like instant responding.
In AJAX applications client side browsers will take more responsibility than traditional web pages. Most of client side effort are done by JavaScript. JavaScript will get data from server and manipulate the browser’s ‘DOM’ model.
The “X” in AJAX stands for XML. But XML is redundant for internet transmission. There’s a better replacement called JSON. JSON is easy and lightweight and efficient to use for all browsers. To use JSON for this TurboGears example, we just have to tell TurboGears that we want to use it via a second @expose() decorator.
@expose(template="tutorial.templates.welcome")
@expose("json")
def index(self):
records = ['iterable', 'items']
return dict(records = records)
Now, if point your browser at http://localhost:8080/index?tg_format=json, you’ll see your records in JSON format.
This easy conversion to JSON is the other use for returning a dictionary. In standard CherryPy methods, you can return a string containing the rendered page. You can do that with TurboGears as well, but a free JSON interface is a pretty good reason to to it the TurboGears way. You can return as many formats as you likeby stacking more @expose() decorators. Check out the @expose reference </1.0/ExposeDecorator> article for details.
For the client side of this tutorial, we’ll be using MochiKit, a lightweight JavaScript library that adds some Pythonic features to JavaScript and makes handling AJAX easier, the official JavaScript framework of TurboGears. The two are only loosely coupled, as opposed to prototype/Rails, but we find MochiKit to provide a very elegant Python-inspired API while avoiding monkeypatches on the JavaScript datatypes.
The first thing we need to do is have MochiKit included in all of our pages. This can be done by editing the master.html file or by having TurboGears add it as a widget.
Open the tutorial/config/app.cfg. This file controls environment-independent settings like identity and output encoding. Search through the file for the tg.include_widgets setting, uncomment it, and modify it like so:
tg.include_widgets = ['turbogears.mochikit']
As the name indicates, we actually are using TurboGears’ widget infrastructure to do the inclusion. Widgets are an advanced feature and are out of scope for this tutorial, but they’re essentially self-contained bundles of HTML+behavior code that make building forms a snap. One of the things they can do is include JavaScript in a page and the turbogears.mochikit takes advantage of this to provide a JavaScript library. The cogbin has other JavaScript libraries packed up as widgets that can be used the same way.
Note
TurboGears could easily support any JavaScript library with its widget system. Check cogbin to look at JavaScript extensions such as the “script.aculo.us” and “jquery” widget packages.
After making this configuration change, restart the server. The auto-reload functionality only detects changes to Python files.