When I introduced the polls to the site, I only knew of one method to do it and that was to use iFrames but I am glad to say that I've finally been able to do the polls using Ajax - but not without *many* sleepless nights...
So that you dont have to go through the same pain and agony, here are a few pointers.
The main problem I was having was that I was using one object to process each poll - up to four polls on each page. As the page loaded, the object that makes the XMLHttpRequest was being called. The response were then to be fed into divs where the polls were to appear. The problem was that the object was not handling simultaneous multiple requests properly and sometimes responses would not feed into their appropriate divs - but sometimes they would.
I tried things like using setTimeout() to set a time delay after each request and also tried feeding all the requests through an array so that each XMLHttpRequest would be made one at a time with no luck at all.
I was about to take a dive out the window when I discovered the existence of two libraries that would help me process multiple requests.
Prototype and
Rico are the libraries that saved me and helped me realize how multiple requests should be handled. Rico is dependent on prototype so you need to include both of them.
function update(){
ajaxEngine.registerRequest("multiple","/UrlOfScript");
ajaxEngine.registerAjaxElement("div567");
ajaxEngine.registerAjaxElement("div563");
ajaxEngine.sendRequest("multiple","");
}
window.onload=function(){
update();
}
ajaxEngine is a variable that refers to the Rico.AjaxEngine object and is available in rico.js. What the ajaxEngine.registerAjaxElement is doing is registering the divs that need to be populated when the responses are returned. the UrlOfScript is the location of the server side script that will process and return results - I stick variables on the end like UrlOfScript.php?poll[title]=do+you+love+gundam...
What you have to do is to get UrlOfScript.php to return the response in XML format...
<? header("Content-Type: application/xml"); ?>
<ajax-response>
<response type="element" id="div567">
<![CDATA[Returned HTML goes here
]]>
</response>
<response type="element" id="div563">
<![CDATA[Returned HTML goes here
]]>
</response>
</ajax-response>
As you can see I just use CDATA and dump my html in there. if you are using php, you can use ob_start(), ob_get_contents() and ob_end_clean() to help you generate the XML response.
I've done QA in FF, and Safari on a Mac and FF, IE6 on Windows and everything seems to work fine - do let me know if you spot problems.
By the way - if you are wondering what the image has to do with this post then the answer is absolutely nothing - I thought it was cute and would keep you awake during this post. Its for a
game called "ef" coming out this year...
