jQuery in Action
266
CHAPTER 8
Talk to the server with Ajax
We achieved the appealing drop shadows in our images by using
PNG
files with partial transparencies. Although most browsers handle this file
format well,
format well,
IE6
does not and displays the
PNG
files with white back-
grounds. To deal with this we could also supply
GIF
formats for the images
without the drop shadows. How would you enhance the page to detect
when
when
IE6
is being used and to replace all the
PNG
references with their
corresponding
GIF
s?
While we're talking about the images, we only have one photo per boot
style, even when multiple colors are available. Assuming that we have
photo images for each possible color, how would you enhance the page to
show the appropriate image when the color is changed?
style, even when multiple colors are available. Assuming that we have
photo images for each possible color, how would you enhance the page to
show the appropriate image when the color is changed?
Can you think of other improvements to make to this page or the
termifier()
command? Share your ideas and solutions at this book's discussion forum, which
you can find at http://www.manning.com/bibeault.
you can find at http://www.manning.com/bibeault.
8.6 Summary
Not surprisingly, this is one of the longest chapters in this book. Ajax is a key part
of Rich Internet Applications, and jQuery is no slouch in providing a rich set of
tools for us to work with.
of Rich Internet Applications, and jQuery is no slouch in providing a rich set of
tools for us to work with.
For loading
HTML
content into
DOM
elements, the
load()
command provides
an easy way to grab the content from the server and make it the content of any
wrapped set of elements. Whether a
wrapped set of elements. Whether a
GET
or
POST
method is used is determined
by whether data needs to be passed to the server or not.
When a
GET
is required, jQuery provides the utility functions
$.get()
and
$.getJSON()
; the latter is useful when
JSON
data is returned from the server. To
force a
POST
, the
$.post()
utility function can be used.
When maximum flexibility is required, the
$.ajax()
utility function, with its
ample assortment of options, lets us control most aspects of an Ajax request. All
other Ajax features in jQuery use the services of this function to provide their
functionality.
other Ajax features in jQuery use the services of this function to provide their
functionality.
To make managing the bevy of options less of a chore, jQuery provides the
$.ajaxSetup()
utility function that allows us to set default values for any fre-
quently used options to the
$.ajax()
function (and to all of the other Ajax func-
tions that use the services of
$.ajax()
).
To round out the Ajax toolset, jQuery also allows us to monitor the progress
of Ajax requests and associate these events with
DOM
elements via the