DIV-problem in AJAX,please help me

[aniltc]

hi all

iam new to ajax . I am facing some problem.i am not able to put the div in the correct postion in the program (actualy i don't know where to put the div in this program.Now i have given the div for all pages.)

 

The aim of the program is when i click on a picture (i am getting around 6 images from server) without reload

the page I want to display that image in the center of the page.I have done the coding part,entire thing is working.I am getting picture from server and ajax also working.But when i am clicking on a particular image

the entire picture in a row is refershing.I want to referesh only a particular area in the page using ajax.i know its not ajax problem.what i am facing here div's problem.i have not given div in a proper position

 

please help me.............

 

 

see the code below-php code

 

<div id='txtHint'>
<script src="nam_detail.js"></script>
<?php
//$id=$_GET['id'];
//header('Content-type: text/html');

require_once 'MDB2.php';

$dsn = 'mysql://root:@localhost/mathew';
$options = array(
    'debug'       => 2,
    'portability' => DB_PORTABILITY_ALL,
   );

$mdb2 =& MDB2::factory($dsn, $options);
if (PEAR::isError($db)) {
    die($db->getMessage());
}

$res =& $mdb2->query("SELECT * FROM images");
//echo "<div id='txtHint'>";
while ($row = $res->fetchRow(MDB2_FETCHMODE_ASSOC)) {
echo "<img src='$row[image_path]' name=\"top6\" width=\"125\" height=\"85\" border=\"0\" onclick=\"showUser($row[id])\">";
echo "</img>";
}
//echo "</div>";



$id=$_GET['id'];

$res1 =& $mdb2->query("SELECT *  FROM images where id='$id' ");

?>
<table width="200" border="0">
  <tr>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td><?php 
while ($row1 = $res1->fetchRow(MDB2_FETCHMODE_ASSOC)) {
echo "<img src='$row1[image_path]' name='top4' width='125' height='85' border='0'>"; } 
?></td><div  align="center" id="as"></div>
    <td> </td>
  </tr>
</table>

</div>

 

JAVASCRIPT CODE

 

//Create a boolean variable to check for a valid Internet Explorer instance.
var xmlhttp = false;
//Check if we are using IE.
try {
//If the Javascript version is greater than 5.
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
//alert ("You are using Microsoft Internet Explorer.");
} catch (e) {
//If not, then use the older active x object.
try {
//If we are using Internet Explorer.
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
//alert ("You are using Microsoft Internet Explorer");
} catch (E) {
//Else we must be using a non-IE browser.
xmlhttp = false;
}
}
//If we are using a non-IE browser, create a javascript instance of the object.
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
xmlhttp = new XMLHttpRequest();
//alert ("You are not using Microsoft Internet Explorer");
}
function showUser(str) {


//document.images['top2'].src=null;
//'dbcon.php'
var url='image.php';
url=url+"?id="+str;
url=url+"&sid="+Math.random();
xmlhttp.open("GET",url,true);

xmlhttp.onreadystatechange = function() {
//alert("test");
 if (xmlhttp.readyState == 1 || xmlhttp.readyState == 2 || xmlhttp.readyState == 3)
 {
	document.getElementById("as").innerHTML="<img src=images/ajax-loader.gif>"; 

	//document.images['top2'].src='images/ajax-loader.gif';
	} 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
    {

document.getElementById("txtHint").innerHTML=xmlhttp.responseText ;
//	alert("test");
    }
  }
//  alert(obj.innerHTML);

xmlhttp.send(null);
}

 

[chanchelkumar]

Give that DIV to the place where you want to display the pic>>>>

Means inside the code...

 

The above code will reload in div...