Ajax with PHP, displaying smoothgallery

[sassenach]

Hi there,

 

I am using AJAX XMLHttpRequest with PHP in order to view full project photos according to project id.

 

This is my ajax request:

function getMessageResponse(str){
var xmlHttp;
try{
	// Firefox, Opera 8.0+, Safari
	xmlHttp=new XMLHttpRequest();
}
catch (e){
    // Internet Explorer
  		try{
	    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    	}
	catch (e){
    	try{
      	xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
        	}
		catch (e){
		  alert("Your browser does not support AJAX!");
		  return false;
		}
    	}
}

xmlHttp.onreadystatechange=function(){
	if(xmlHttp.readyState==4){
	  document.getElementById('response').innerHTML=xmlHttp.responseText;
	  //document.myform.message.value = '';
	}
}

//url=url+"&message="+str;
var url="projects.php?mid=3";	
url=url+"&pid="+str;
url=url+"&sid="+Math.random();
xmlHttp.open("GET",url,true);
xmlHttp.overrideMimeType("text/html; charset=windows-1255"); /*TO DISPLAY HEBREW CHARACTERS*/
xmlHttp.send(null);
}

 

This is my <li> in index.php:

<li class="text2 corner" id="response" name="response"> </li>

 

This is my projects.php page:

<?php //projects
require_once ('includes/config.inc.php');						  
require_once ('includes/functions.inc.php');
require_once ('includes/mysql_connect.php');
if(isset($_GET['pid'])) {
$pid = (int) $_GET['pid'];
//echo "project id: $pid---";	
$projectsQ1 = mysql_query("
SELECT projects.proj_id AS pid, projects.location AS plocation, projects.title AS ptitle, images_to_proj.img_id AS img_id, images_to_proj.caption AS caption, images_to_proj.file_name AS file_name 
FROM projects INNER JOIN images_to_proj ON projects.proj_id=images_to_proj.proj_id 
WHERE projects.proj_id=".$pid."") or trigger_error("Query: $projectsQ1\n<br />MySQL Error: " .mysql_error());
    if(mysql_num_rows($projectsQ1) > 0){
	//$projectsR1 = @mysql_fetch_array ($projectsQ1);
	echo '<link rel="stylesheet" href="/includes/smoothgallery/css/layout.css" type="text/css" media="screen" charset="utf-8" />
		<link rel="stylesheet" href="/includes/smoothgallery/css/jd.gallery.css" type="text/css" media="screen" charset="utf-8" />
		<link rel="stylesheet" href="/includes/smoothgallery/css/ReMooz.css" type="text/css" media="screen" charset="utf-8" />
		<script language="javascript" type="text/javascript" src="/includes/smoothgallery/scripts/mootools-1.2.1-core-yc.js"></script>            
		<script language="javascript" type="text/javascript" src="/includes/smoothgallery/scripts/mootools-1.2-more.js"></script>
		<script language="javascript" type="text/javascript" src="/includes/smoothgallery/scripts/ReMooz.js"></script>
		<script language="javascript" type="text/javascript" src="/includes/smoothgallery/scripts/jd.gallery.js"></script>

	<div id="myGallery">';
	while ($projectsR1 = mysql_fetch_array($projectsQ1, MYSQL_ASSOC)) {
		$getImg1 = getUploadImgPath(27, "/site_uploads/portfolio/", $projectsR1['file_name'], $projectsR1['img_id'], 1, "portfolio");
		$ImgThumb_small = str_replace($image_ext, '_site_thumb.jpg', strtolower($getImg1));
		list($width1, $height1, $type, $w) = getimagesize(strtolower($getImg1));
		if($width1 >= 632){	//if image was large, get resized
			$thumbimg_large = str_replace($image_ext, '_large_thumb.jpg', strtolower($getImg1));
		} else {$thumbimg_large = $getImg1;}
		//echo '--->'.$projectsR1['plocation'].' - '.$projectsR1['ptitle'].' - '.$projectsR1['img_id'].' - '.$thumbimg_large.'<br/>';
		echo '<div class="imageElement">
				<h3>'.$projectsR1['ptitle'].' '.$projectsR1['plocation'].'</h3>
				<p>'.$projectsR1['caption'].'</p>
				<a href="'.$thumbimg_large.'" title="open image" class="open"></a><img src="'.$thumbimg_large.'" class="full" /><img src="'.$ImgThumb_small.'" class="thumbnail" />
		</div>';
	}
	echo '</div>
	<script language="javascript" type="text/javascript"> 
			function startGallery() {
			var myGallery = new gallery($(\'myGallery\'), {
				timed: false,
				useReMooz: true,
				embedLinks: false
			});
			}
			window.addEvent(\'domready\',startGallery);
		</script>';
	mysql_free_result ($projectsQ1);
}
}
?>

 

When I display the smoothgallery in index.php page, it works perfectly. It really displays the gallery show. Since I put the gallery in "projects.php" page, it only displays the photos and not inside a gallery show.

 

You can test this by using this link [http://www.maestro2007.co.il/index.php?mid=3], click on a thumbnail on the right, that should open the gallery on the left.

 

Is this an issue with ajax request that its not showing the gallery? Any suggestions/ideas are welcomed.

 

Thanks,

M