Hi Guys
I need some expert advice on Ajax.
I have some difficulties updating a <div> tag inside a table with Ajax.
My html looks like this:
------------------------
...
[HTML]<table>
<tr>
<td>
<img src="../photos/abc_thumb.jpg" onClick="Load_Full_Size('abc')" />
<div id="abc" ></div>
</td></tr>
</table>
[/HTML]...
------------------------
The content I want to add inside <div> tag is the following (extra) <img> tag:
[HTML]<img src="../photos/abc_full_size.jpg" />
[/HTML]
This will be done by a php script which is already tested & functioning.
------------------------
The Ajax for this task is like following:
- var objXMLHttpReq1 = createXMLHttpReq();
-
var urlPhotoPhp = "showphoto.php?photo=";
-
-
-
function Load_Full_Size(strItemPhoto)
-
{
-
-
objXMLHttpReq1.open("GET", urlPhotoPhp + escape(strItemPhoto) , true);
-
objXMLHttpReq1.onreadystatechange = Response_Handler_Photo();
-
objXMLHttpReq1.send(null);
-
-
-
}
-
-
-
function Response_Handler_Photo()
-
{
-
-
if (objXMLHttpReq1.readyState == 4)
-
{
-
-
document.getElementById(strItemPhoto).innerHTML = objXMLHttpReq1.responseText;
-
}
-
}
-
-
-
function createXMLHttpReq()
-
{
-
var objXMLHttpReq;
-
-
if (window.XMLHttpRequest)
-
{
-
// Other Browsers
-
//
-
objXMLHttpReq = new XMLHttpRequest();
-
-
}
-
else if (window.ActiveXObject)
-
{
-
// IE
-
//
-
objXMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
-
-
}
-
-
return objXMLHttpReq;
-
-
}
------------------------
Apparently, the whole thing works when <div> is outside the table, but I need the full size pic inside the table :/
Any ideas? Thanks.