How can we display image using ajax

[sajan]

Hi I use prototype frame work.When i try to display image using ajax response,i get the characters instead of image.What should i do to display image.my code

<table align="center" width="400"><tr><td><a href="#" onclick="drawFigure('1')">Draw Circle</a></td><td><div><img id="circle"/></div></td></tr></table>

ajax code

function handleResponse(response) 			{ 		  $('circle').innerHTML=response;							 }

[Synook]

you don't need to call an image using AJAX, you can just write an <img /> tag to the document or change the src of an image tag and the image will be displayed. AJAX is for text and XML data. So your drawFigure() function may look like this

function drawFigure(figure) {document.getElementById('circle').src = "images/figure_" + figure + ".gif";}

That is all no need for AJAX.

[sajan]

But i use php generated images.I have to create image according to fig value.Say if fig=1, circle will be created ,2 line will be created(on draw_figur.php).Then how can i pass the parameter fig to draw_figure.php without using ajax.

[Synook]

Doesn't matter, just reference the PHP script in the src attribute of the image. You can pass parameters through the querystring, e.g.

<img src="draw_figur.php?fig=1" />

function drawFigure(figure) {document.getElementById('circle').src = "draw_figur.php?fig=" + figure;}

[sajan]

Thanks synook.Its worked .i didn't know that query string can be passed through img tag.thanks a lot.