[SOLVED] AJAX & PHP Image

[The Little Guy]

OK... Here is what is happening, the image is created fine, so I think that it is the JavaScript/AJAX but In the H2, tag there is a link called Skip, it is supposed to do the AJAX request, and get a new image.

 

Instead I just gets the current image.... To see what I mean, go here:

http://publicsize.com/hot_or_not/index2

 

You will see an image, if you press "Skip", it will display the same image.

 

Why won't it change images????

If you go here:

http://publicsize.com/hot_or_not/process/image?gender=Female

and then press F5 a few times, you will see that it does in fact generate a random image... So what's wrong?

 

index2.php

<?php
if(!$openFile){
	include '../../../includes/functions.php';
	$file = folderBase(getFile($_SERVER['SCRIPT_FILENAME']));
	$file = removeSubDir($file);
	header("Location: /".$file);
	exit;
}
?>
<div class="content_content_head">
	<span class="head2">Hot Or Not?</span>
</div>
<script type="text/javascript">
	function searchType(type){
		document.getElementById('next').href = "javascript:next('"+type+"');";
		next(type);
	}
	function next(gender){
		var ajaxRequest;
		try{
			ajaxRequest = new XMLHttpRequest();
		} catch (e){
			try{
				ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				try{
					ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
				} catch (e){
					alert("Your Browser Doesn't support AJAX.");
					return false;
				}
			}
		}
		ajaxRequest.onreadystatechange = function(){
			if(ajaxRequest.readyState < 4){
				document.getElementById('displayImage').innerHTML = 'Loading';
			}else if(ajaxRequest.readyState == 4){
				document.getElementById('displayImage').innerHTML = ajaxRequest.responseText;
			}
		}
		ajaxRequest.open("GET", 'process/nextImg?gender='+gender, true);
		ajaxRequest.send(null);
	}
</script>
<div class="content_content_home">
	<span class="profile_home">
			<form>
				<p>
					Show Gender:
					<select name="gender">
						<option onClick="javascript:searchType('Female');">Women</option>
						<option onClick="javascript:searchType('Male');">Men</option>
						<option onClick="javascript:searchType('both');">Random</option>
					</select>
				</p>
			</form>
		<div id="displayImage" align="center">
			<img src="process/image?gender=Female" />
		</div>
		<p align="center">
			<img src="includes/images/hot_cold.gif" />
		</p>
		<h2 align="center"><a id="next" href="javascript:next('Female');">Skip</a></h2>
	</span>
</div>

 

nextImg.php

<img src="process/image?gender=<?php echo $_GET['gender']; ?>" />

 

image.php

<?php
// The file
$gender = addslashes($_GET['gender']);
include"../../includes/db.php";
if($gender != 'both'){
$sql = mysqli_query($db,"SELECT * FROM users,friends_images WHERE 
users.gender = '$gender'
AND
friends_images.`default` = '1'
AND
users.id = friends_images.ownerID ORDER BY RAND() LIMIT 1")or die(mysqli_error($db));
}else{
$sql = mysqli_query($db,"SELECT * FROM users,friends_images WHERE
friends_images.`default` = '1'
AND
users.id = friends_images.ownerID ORDER BY RAND() LIMIT 1")or die(mysqli_error($db));
}
$row = mysqli_fetch_array($sql);
$filename = "../../images/users/full/".$row['fileName'];
$details = getimagesize($filename);
$thumbWidth = 300;
eval('header("Content-type: '.$details['mime'].'");');
// Get new sizes
$type = preg_replace('@^.+(?<=/)(.+)$@', '$1', $details['mime']);


eval('$srcImg = imagecreatefrom'.$type.'("$filename");');
$thumbHeight = $details[1] * ($thumbWidth / $details[0]);
$thumbImg = imagecreatetruecolor($thumbWidth, $thumbHeight);


imagecopyresampled($thumbImg, $srcImg, 0, 0, 0, 0, $thumbWidth, $thumbHeight, $details[0], $details[1]);
eval('image'.$type.'($thumbImg, NULL, 100);');
?>