AJAX - The Complete Reference

416 Part II: Developing an Ajax Library^

to read arbitrary values for the submission of the form, and second, it provides a fallback in

the unlikely case that JavaScript is on but images are off.

ratingOptions.prefixID = AjaxTCR.util.misc.generateUID("AjaxTCRRatingChoice");

/* add the images setting the alt to the rating value */

for (i = 0 ; i < ratingOptions.choices; i++)

{

var ratingImage = document.createElement("img");

ratingImage.id = ratingOptions.prefixID + (i+1);

ratingImage.alt = choiceValues[i];

ratingImage.title = "";

ratingImage.onclick = function () {AjaxTCR.widget.ratingWidget._rateClick(this,

ratingOptions);};

ratingImage.onmouseover = function () {AjaxTCR.widget.ratingWidget._rateOver(this,

ratingOptions);};

ratingImage.src = ratingOptions.choiceOff;

ratingOptions.ratingContainer.appendChild(ratingImage);

}

We introduce a new AjaxTCR.util function here. AjaxTCR.util.generateUID()

generates a unique id value based on the time. You can optionally pass it a prefix to be

prepended to the unique value. If you only want the unique number, pass it –1. No

specified prefix will result in the UID being prefixed with AjaxTCR.

Finally, the event is set to capture when the user moves away from the choices, and the

new widget is then displayed.

/* set event to turn off images */

ratingOptions.ratingContainer.onmouseout = function ()

{AjaxTCR.widget.ratingWidget._rateOut(ratingOptions);};

/* show the new ratings presentation */

ratingOptions.ratingContainer.style.visibility = "visible";

Eventually, when the user clicks their choice, the XHR communication will be invoked:

AjaxTCR.widget.ratingWidget.sendRating(choice.alt, ratingOptions);

calling a familiar sendRating() method that has been updated to use configuration object

property values for flexibility rather than hard-coded literals.

_sendRating : function(rating, ratingOptions) {

var url = ratingOptions.url;

var options = { method: ratingOptions.method,

outputTarget : ratingOptions.outputTarget,

payload : ratingOptions.argument+"=" + rating };

AjaxTCR.comm.sendRequest(url,options);}

Now that the client-side of the example is “Ajaxified”, the server-side mechanism must

not respond with a whole new result page; only the results should be returned. One option

would be to modify the destination URL to target a different server-side program. Another

possibility would be to pass a value to indicate the type of result desired. For example, we