Jump to content

why doees function GetAverage() return "undefined" ?


rain13
 Share

Recommended Posts

Does anyone know why GetAverage() returns me undefined instead of string it receives from server? GetAverage(); should return me average rating.Preview: http://autoit.net.ee/rate/rate.phpwhen you move mouse on stars and then away again you can see Average: undefined

<?php$file = "rate.txt";$user = $_GET["r"];if (strlen($user) >= 1){$fData = FileRead($file);$fData = explode("|",$fData);if ($user == "get") {echo $fData[1]/$fData[0];exit(0);}$fData[0]++;$fData[1] += $user;FileWrite($file,$fData[0]."|".$fData[1]);echo $fData[1]/$fData[0];exit(0);}$fData = FileRead($file);$fData = explode("|",$fData);$average = $fData[1]/$fData[0];function FileRead($sFile){	$fd = fopen ($sFile , "r");	if ($fd) {		if (filesize($sFile) > 0){			$fstring = fread ($fd , filesize ($sFile));			fclose($fd);			return $fstring;		}else{			fclose($fd);			return "";			}	}	else{		echo '<font color="#FF0000">ERROR:</font> Can not read file '.$sFile;		return false;	}}function FileWrite($sFile,$sString){if (strlen($sString) > 0){	$hFile = fopen($sFile, 'w+');	if	($hFile){		fwrite($hFile, $sString);		fclose($hFile);		return true;	}}return false;}?><html><head>	<title>Javascript Change Image Onmouseover</title>	 <style type="text/css">	p {	font-family:Verdana;	font-weight:bold;	font-size:11px	}	img {	cursor:pointer;	}	</style>	<script language="javascript" type="text/javascript">	var average = GetAverage();	//var average = "abc"	function mouseOverImage(n)	{		document.getElementById("txt").innerHTML = n;		for (i=1;i<=n;i++)		{			document.getElementById("img"+i).src = "0.png";		}	}	function mouseOutImage()	{		document.getElementById("txt").innerHTML = "Average: "+average;		for (i=5;i>=1;i--)		{			document.getElementById("img"+i).src = "1.png";		}	}	function Rate(i){	var ajaxRequest;  // The variable that makes Ajax possible!	try{		// Opera 8.0+, Firefox, Safari		ajaxRequest = new XMLHttpRequest();	} catch (e){		// Internet Explorer Browsers		try{			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");		} catch (e) {			try{				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");			} catch (e){				// Something went wrong				alert("Your browser broke!");				return false;			}		}	}	// Create a function that will receive data sent from the server	ajaxRequest.onreadystatechange = function(){		if(ajaxRequest.readyState == 4){			average = ajaxRequest.responseText;			document.getElementById("txt").innerHTML = "Average: "+ average;		}	}	ajaxRequest.open("GET", "rate.php?r="+i, true);	ajaxRequest.send(null);	}	function GetAverage(){	var ajaxRequest;  // The variable that makes Ajax possible!	try{		// Opera 8.0+, Firefox, Safari		ajaxRequest = new XMLHttpRequest();	} catch (e){		// Internet Explorer Browsers		try{			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");		} catch (e) {			try{				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");			} catch (e){				// Something went wrong				alert("Your browser broke!");				return false;			}		}	}	// Create a function that will receive data sent from the server	ajaxRequest.onreadystatechange = function(){		if(ajaxRequest.readyState == 4){			return ajaxRequest.responseText;		}	}	ajaxRequest.open("GET", "rate.php?r=get", true);	ajaxRequest.send(null);	}	</script></head><body><table style="text-align: left;" border="0" cellpadding="0" cellspacing="0">  <tbody>	<tr>		<td><img id="img1" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(1)" onmouseout="mouseOutImage(5)" onmousedown="Rate(1)"/><img id="img2" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(2)" onmouseout="mouseOutImage(4)" onmousedown="Rate(2)"/><img id="img3" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(3)" onmouseout="mouseOutImage(3)" onmousedown="Rate(3)"/><img id="img4" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(4)" onmouseout="mouseOutImage(2)" onmousedown="Rate(4)"/><img id="img5" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(5)" onmouseout="mouseOutImage(1)" onmousedown="Rate(5)"/></td>	</tr>	<tr>		<td id="txt">			<?php echo "Average: ".$average?>		</td>	</tr>  </tbody></table></body></html>

Edited by SoItBegins
Link to comment
Share on other sites

You're trying to set average to the return value of GetAverage, but the only thing GetAverage returns is false if the XHR object couldn't be created. If you want that to return the value that the server returned then your request must be synchronous, not asynchronous. You send the request, wait for the response, and then return the result. Javascript will be basically paused while it's waiting for the response, so you might see a bigger delay. Otherwise, set the value of average in the readystate handler.

Link to comment
Share on other sites

I still don't get it. Why Rate(i) works? but GetAverage() does'nt? GetAverage() is same as Rate expect it return ajaxRequest.responseText instead of setting it txt's value. You see GetAverage() is copied and then modified. but works exactly the same way Rate() does.

Edited by SoItBegins
Link to comment
Share on other sites

The readystate handler for the Rate function updates the page directly, the handler in the GetAverage function does not, it tries to return a value. Values returned from a readystate handler don't go anywhere.

GetAverage() is same as Rate expect it return ajaxRequest.responseText instead of setting it txt's value
No, it doesn't. The readystate handler returns a value, not GetAverage. GetAverage only returns false if the XHR object couldn't be created, otherwise it doesn't return anything at all (i.e., undefined).Look into synchronous requests, even though Javascript has to wait for the response you'll be able to have the function return it.
Link to comment
Share on other sites

Thanks for advise.Here's working code (hopefully it helps someone who is trying to do similar thing)

<?php$file = "rate.txt";$user = $_GET["r"];if (strlen($user) >= 1){$fData = FileRead($file);$fData = explode("|",$fData);if ($user == "get") {echo $fData[1]/$fData[0];exit(0);}$fData[0]++;$fData[1] += $user;FileWrite($file,$fData[0]."|".$fData[1]);echo $fData[1]/$fData[0];exit(0);}$fData = FileRead($file);$fData = explode("|",$fData);$average = $fData[1]/$fData[0];function FileRead($sFile){	$fd = fopen ($sFile , "r");	if ($fd) {		if (filesize($sFile) > 0){			$fstring = fread ($fd , filesize ($sFile));			fclose($fd);			return $fstring;		}else{			fclose($fd);			return "";			}	}	else{		echo '<font color="#FF0000">ERROR:</font> Can not read file '.$sFile;		return false;	}}function FileWrite($sFile,$sString){if (strlen($sString) > 0){	$hFile = fopen($sFile, 'w+');	if	($hFile){		fwrite($hFile, $sString);		fclose($hFile);		return true;	}}return false;}?><html><head>	<title>Javascript Change Image Onmouseover</title>	 <style type="text/css">	p {	font-family:Verdana;	font-weight:bold;	font-size:11px	}	img {	cursor:pointer;	}	</style>	<script language="javascript" type="text/javascript">	var average = GetAverage();	//var average = "abc"	function mouseOverImage(n)	{		document.getElementById("txt").innerHTML = n;		for (i=1;i<=n;i++)		{			document.getElementById("img"+i).src = "0.png";		}	}	function mouseOutImage()	{		document.getElementById("txt").innerHTML = "Average: "+average;		for (i=5;i>=1;i--)		{			document.getElementById("img"+i).src = "1.png";		}	}	function Rate(i){	var ajaxRequest;  // The variable that makes Ajax possible!	try{		// Opera 8.0+, Firefox, Safari		ajaxRequest = new XMLHttpRequest();	} catch (e){		// Internet Explorer Browsers		try{			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");		} catch (e) {			try{				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");			} catch (e){				// Something went wrong				alert("Your browser broke!");				return false;			}		}	}	// Create a function that will receive data sent from the server	ajaxRequest.onreadystatechange = function(){		if(ajaxRequest.readyState == 4){			average = ajaxRequest.responseText;			document.getElementById("txt").innerHTML = "Average: "+ average;		}	}	ajaxRequest.open("GET", "rate.php?r="+i, true);	ajaxRequest.send(null);	}	function GetAverage(){	var ajaxRequest;  // The variable that makes Ajax possible!	try{		// Opera 8.0+, Firefox, Safari		ajaxRequest = new XMLHttpRequest();	} catch (e){		// Internet Explorer Browsers		try{			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");		} catch (e) {			try{				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");			} catch (e){				// Something went wrong				alert("Your browser broke!");				return false;			}		}	}	// Create a function that will receive data sent from the server	ajaxRequest.onreadystatechange = function(){		if(ajaxRequest.readyState == 4){			average = ajaxRequest.responseText;		}	}	ajaxRequest.open("GET", "rate.php?r=get", true);	ajaxRequest.send(null);	}	</script></head><body><table style="text-align: left;" border="0" cellpadding="0" cellspacing="0">  <tbody>	<tr>		<td><img id="img1" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(1)" onmouseout="mouseOutImage(5)" onmousedown="Rate(1)"/><img id="img2" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(2)" onmouseout="mouseOutImage(4)" onmousedown="Rate(2)"/><img id="img3" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(3)" onmouseout="mouseOutImage(3)" onmousedown="Rate(3)"/><img id="img4" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(4)" onmouseout="mouseOutImage(2)" onmousedown="Rate(4)"/><img id="img5" src="1.png" width="24" height="24" alt="image rollover" onmouseover="mouseOverImage(5)" onmouseout="mouseOutImage(1)" onmousedown="Rate(5)"/></td>	</tr>	<tr>		<td id="txt">			<?php echo "Average: ".$average?>		</td>	</tr>  </tbody></table></body></html>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...