AJAX - The Complete Reference

(avery) #1

438 Part II: Developing an Ajax Library^


"http://ajaxref.com/ch9/templates/ratingTemplate.tpl", ratingData);
$id("ratingResult").innerHTML = renderedResponse;
}

Of course, this just seems like a variation of outputTarget, but this time a template is
fetched and populated and then that result is shoved into the element we are interested in.
It would be easy enough to automate this process, so we introduce new options for the
request, template and templateRender. The template property is set to the URL of a
template to use or the keyword "dynamic" if that template is going to be specified
dynamically as a result of the call. The templateRender property indicates where the
rendering of the template should happen and takes either "client" or "server". As an
example here, we show a request to a server-side program that will record the rating, but
we specify a template to be used on the client-side:

var url = "http://ajaxref.com/ch9/ratetemplate.php";
var options = { method: "POST",
payload : "rating="+rating,
template : "templates/ratingResult.tpl",
templateRender : "client",
outputTarget : "ratingResult"
};
AjaxTCR.comm.sendRequest(url,options);

In this case, the library will first make a request for the ratingResult.tpl file and set
enforceOrder so that there are no issues with requests being out of order or handling the
data before the template is received. We can see that process in the network trace here:

Once the template and the data are down, the local render applies the content from that
response to the template and adds it to the page. The DOM inspection here clearly shows
the rendered template correctly populated.
Free download pdf