After makeHttpRequest how to run update javascript vars?

masipay · 03-01-2009, 04:09 AM

By making httpRequest to php script, I am able to print the output to target container. But, i need to update javascript variable after this which i am not alble to do, any suggestion?

<script..>
var rate = 3.3;
</script.

<div id="outputDiv">


<div onMouseover="myfunc();" onclick="getNewText to replacealllthis();"> this is output by ajax http request</div>


</div>

function myfunc()
{
alert(rate); // rate was initially 3.3

//after onclick event the value of rate has changed to say 4.4
// but onMouseover event will still alert 3.3 so how to update this rate var
// 4.4 ??

}

simple solution is to create output text as
<div onMouseover="myfunc(4.4);" onclick="getNewText to replacealllthis();"> this is output by ajax http request</div>

->> and myfunc alert the val
However I don't want to pass param to myfunc() but use single var rate to do this event.

1. Can I ie is there a way to receive a return value from php script as well as the responseText?

2. I tried outputting
<script type="...">
var rate = 4.4;
</script> ... and rest of response text
but all the response text willl simply be printed in the output div and the updated var rate is not run . so is there a way to make this assignment of new value to rate run?

thanks

A1ien51 · 03-01-2009, 10:54 PM

JavaScript does not execute script tags with innerHTML, you need to eval() it. Most JavaScript libraries will do this for you.

Eric

masipay · 03-08-2009, 01:08 AM

Quote:

Originally Posted by A1ien51

JavaScript does not execute script tags with innerHTML, you need to eval() it. Most JavaScript libraries will do this for you.

Eric

Well Alien if you could be little more specific on how to use eval , would be much more help.

You see the initially javascript var rating = 10 was printed

after making http ajax request this value might have been changed, lets just say I need to change this var to 20,
so if i print the var again like var rating = 20 from output handler function, how do I run this script?

I am forced to use a function update(20) after getting the httpReq out put through javascript function which i want to avoid.
Thanks.

itsallkizza · 03-08-2009, 09:23 AM

If I understand you correctly you want something like this concept:

example: http://buildyourownbagel.com/test/test.html

test.html:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Example</title>
<style type="text/css">
</style>
<script type="text/javascript">
// <![CDATA[

function XMLHTTP_Util()
	{
	this.sendRequest = function(url,method,params,async,callback,callbackargs)
		{
		method = method ? method.toUpperCase() : "GET";
		if (typeof(callback) == "string") callback = new Function(callback);
		callback = callback || function(){};
		params = params ? params.join("&") : "";
		if (method == "GET" && params) url += "?"+params;
		var req = this.createXMLHTTPObject();
		if (!req) callback.call(this,false,callbackargs);
		req.ref = this;
		req.open(method,url,async);
		req.setRequestHeader('User-Agent','XMLHTTP/1.0');
		if (method == "POST")
			{
			req.setRequestHeader("Content-type","application/x-www-form-urlencoded");
			req.setRequestHeader("Content-length",params.length);
			req.setRequestHeader("Connection","close");
			}
		req.onreadystatechange = function()
			{
			if (this.readyState != 4) return;
			if (this.status != 200 && this.status != 304)
				{
				//alert("HTTP error " + req.status);
				callback.call(this.ref,false,callbackargs);
				}
			else
				{
				callback.call(this.ref,req,callbackargs);
				}
			}
		if (req.readyState == 4) return;
		req.send(method=="GET"?null:params);
		}
	this.createXMLHTTPObject = function()
		{
		var xmlhttp = false;
		for (var i=0;i<this.XMLHttpFactories.length;i++)
			{
			try
				{
				xmlhttp = this.XMLHttpFactories[i]();
				}
			catch(e)
				{
				continue;
				}
			break;
			}
		return xmlhttp;
		}
	this.XMLHttpFactories = [
	function() {return new XMLHttpRequest()},
	function() {return new ActiveXObject("Msxml2.XMLHTTP")},
	function() {return new ActiveXObject("Msxml3.XMLHTTP")},
	function() {return new ActiveXObject("Microsoft.XMLHTTP")}
	];
	}
var xhu = new XMLHTTP_Util();

var rate = 10;

function calcRate(form_element)
	{
	xhu.sendRequest("get_rate.php","get",["rate_input="+form_element.rate_input.value],true,changeRateAndDisplay);
	return false;
	}

function changeRateAndDisplay(req)
	{
	rate = req.responseText;
	displayRate();
	}

function displayRate()
	{
	document.getElementById("output").innerHTML = "rate = "+rate;
	}

window.onload = function()
	{
	displayRate();
	}

// ]]>
</script>
</head>
<body>

<form onsubmit="return calcRate(this)">
	<input type="text" name="rate_input" value="32" />
	<input type="submit" value="send xmlhttprequest" />
</form>

<br />
<div id="output"></div>

</body>
</html>

get_rate.php:

Code:

<?php
$i = (int)$_GET["rate_input"];
echo($i*0.26);
?>