Ajax refresh problem

[helraizer1]

Hi folks,

I have an AJAX script to refresh a certain element in the page. The problem is that the element I need it to refresh is a dynamic image.. but the way I've done it inserts the raw image into the browser, thus just comes up with gobbledy gook characters and symbols. Would there be any way to do this? or would there be another approach?

function createRequestObject() {
 
   var req;
 
   if(window.XMLHttpRequest){
      // Firefox, Safari, Opera...
      req = new XMLHttpRequest();
   } else if(window.ActiveXObject) {
      // Internet Explorer 5+
      req = new ActiveXObject("Microsoft.XMLHTTP");
   } else {
      // There is an error creating the object,
      // just as an old browser is being used.
     alert("Your Browser Does Not Support This Script - Please Upgrade Your Browser ASAP");
   }
 
   return req;
 
}
 
// Make the XMLHttpRequest object
var http = createRequestObject();
 
function sendRequest(page) {
 
   // Open PHP script for requests
   http.open('get', page);
   http.onreadystatechange = handleResponse;
   http.send(null);
 
}
 
function handleResponse() {
 
   if(http.readyState == 4 && http.status == 200){
 
      // Text returned FROM the PHP script
      var response = http.responseText;
 
      if(response) {
         // UPDATE ajaxTest content
         document.getElementById("captch").innerHTML = response;
      }
 
   }
 
}
 
function repeatloop()
{
sendRequest('captch1.php'); 
setTimeout("repeatloop()", 2000);
}
 
window.onload=function() {
repeatloop();
}

at the moment the image is in a 'span' element. If I change innerHTML to src, and the element to img, it puts the element src to

http://helraizer.dnsalias.net/cap/GIF87a%EF%BF%BD

is there anyway to change this with the code I have/another way?

Sam

[acoder]

Create the image on the server-side, return the image source as the Ajax response and change the src of the img element to the created image.