How do I handle the back and forward buttons?
While you could go out and create a custom solution that
tracks the current state on your application I recommend
you leave this to the experts. Dojo addresses the
navigation in a browser neutral way as can be seen in
the JavaScript example below.
function updateOnServer(oldId, oldValue,
itemId, itemValue) {
var bindArgs = {
url: "faces/ajax-dlabel-update",
method: "post",
content: {"component-id": itemId, "component-value":
itemValue},
mimetype: "text/xml",
load: function(type, data) {
processUpdateResponse(data);
},
backButton: function() {
alert("old itemid was " + oldId);
},
forwardButton: function(){
alert("forward we must go!");
}
};
dojo.io.bind(bindArgs);
}
The example above will update a value on the server
using dojo.io.bind() with a function as a property that
is responsible for dealing with the browser back button
event. As a developer you are capable of restoring the
value to the oldValue or taking any other action that
you see fit. The underlying details of how the how the
browser button event are detected are hidden from the
developer by Dojo.
AJAX: How to Handle Bookmarks and Back Buttons details
this problem and provides a JavaScript library Really
Simple History framework (RSH) that focuses just on the
back and forward issue.
How does HTML_AJAX compare with the XAJAX project at
Sourceforge?
XAJAX uses XML as a transport for data between the
webpage and server, and you don't write your own
javascript data handlers to manipulate the data received
from the server. Instead you use a php class and built
in javascript methods, a combination that works very
similiar to the HTML_AJAX_Action class and haSerializer
combo. XAJAX is designed for simplicity and ease of use.
HTML_AJAX allows for multiple transmission types for
your ajax data - such as urlencoding, json,
phpserialized, plain text, with others planned, and has
a system you can use to write your own serializers to
meet your specific needs. HTML_AJAX has a class to help
generate javascript (HTML_AJAX_Helper) similiar to ruby
on rail's javascript helper (although it isn't
complete), and an action system similiar to XAJAX's
"action pump" that allows you to avoid writing
javascript data handlers if you desire.
But it also has the ability to write your own data
handling routines, automatically register classes and
methods using a server "proxy" script, do different
types of callbacks including grabbing remote urls,
choose between sync and async requests, has iframe
xmlhttprequest emulation fallback capabilities for users
with old browsers or disabled activeX, and is in active
development with more features planned (see the Road Map
for details)
HTML_AJAX has additional features such as client pooling
and priority queues for more advanced users, and even a
javascript utility class. Although you can use HTML_AJAX
the same way you use XAJAX, the additional features make
it more robust, extensible and flexible. And it is a
pear package, you can use the pear installer to both
install and keep it up to date.
If you're asking which is "better" - as with most php
scripts it's a matter of taste and need. Do you need a
quick, simple ajax solution? Or do you want something
that's flexible, extensible, and looking to incorporate
even more great features? It depends on the project, you
as a writer, and your future plans.
What browsers support AJAX?
Internet Explorer 5.0 and up, Opera 7.6 and up, Netscape
7.1 and up, Firefox 1.0 and up, Safari 1.2 and up, among
others.
How do I send an image using AJAX?
While it may appear that images are being sent when
using AJAX with an application like Google Maps what is
really happening is that the URLs of images are being
send as the response of an AJAX request and those URLs
are being set using DHTML.
In this example an XML document is returned from an AJAX
interaction and the category bar is populated.
<categories>
<category>
<cat-id>1</cat-id>
<name>Books</name>
<description>Fun to read</description>
<image-url>books_icon.gif</image-url>
</category>
<category>
<cat-id>2</cat-id>
<name>Electronics</name>
<description>Must have gadgets</description>
<image-url>electronics.gif</image-url>
</category>
</categories>
Notice that the image-url element contains the location
of the URL for the image representing a category. The
callback method of an AJAX interaction will parse the
response XML document and call the addCategory function
for each category included in the response XML document.
The addCategory function looks up a table row element "categoryTable"
in body of the page and adds a row to the element which
contains the image.
<scrip type="text/javascript" >
...
function addCategory(id, name, imageSrc) {
var categoryTable =
document.getElementById("categoryTable");
var row = document.createElement("tr");
var catCell = document.createElement("td");
var img = document.createElement("img");
img.src = ("images\\" + imageSrc);
var link = document.createElement("a");
link.className ="category";
link.appendChild(document.createTextNode(name));
link.setAttribute("onclick", "catalog?command=category&catid="
+ id);
catCell.appendChild(img);
catCell.appendChild(link);
row.appendChild(catCell);
categoryTable.appendChild(row);
}
</script>
...
<table>
<tr>
<td width="300" bgoclor="lightGray">
<table id="categoryTable" border="0" cellpadding="0"></table>
</td>
<td id="body" width="100%">Body Here</td>
</tr>
</table>
Note that the source of the image is set to the image
source. The image is loaded by a subsequent HTTP request
for the image at the URL "images/books_icon.gif" or
"images/electronic_icon.gif" that occurs when the img
element is added to the categoryTable.
Will HTML_AJAX integrate with other Javascript AJAX
libraries such as scriptaculous ? How would this
integration look like?
HTML_AJAX doesn't have specific plans to integrate with
other JavaScript libraries. Part of this is because
external dependencies make for a more complicated
installation process. It might make sense to offer some
optional dependencies on a library like scriptaculous
automatically using its visual effects for the loading
box or something, but there isn't a lot to gain from
making default visuals like that flashier since they are
designed to be easily replaceable.
Most integration would take place in higher level
components. Its unclear whether higher level components
like that should be part of HTML_AJAX delivered through
PEAR or if they should just be supported by HTML_AJAX
and made available from http://htmlajax.org or some
other site. If your interested in building widgets or
components based on HTML_AJAX please let me know.
HTML_AJAX does however offer the ability to use its
library loading mechanism with any JavaScript library. I
use scriptaculous in conjunction with HTML_AJAX and I
load both libraries through the server.
To do this you just need to register the library with
your server and load add its flag to your include line.
<?php
$this->server->registerJSLibrary('scriptaculous',
array('prototype.js','scriptaculous.js','builder.js','effects.js','dragdrop.js','controls.js','slider.js'), '/pathto/scriptaculous/');?>
<script type="text/javascrpt" src="server.php?client=scriptaculous"></script>
