can't pass javascript vars to php

**foobar** · 08-26-2008, 08:37 AM

Hello,

I have the following script and when I use a queryString to pass vars to php the onChange="ajaxFunction" does not seem to work, meaning the page does not get automatically refreshed w/ the output when values are entered into the text box.

When I don't use queryString to pass the vars to php, the php script displays errors b/c it can't read any vars.

Code:

<html>
<body>

<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){
	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){
			//document.myForm.time.value = ajaxRequest.responseText;
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}
	//var loanamt = document.getElementById('loanamt').value;
	//var rate = document.getElementById('rate').value;
	//var term = document.getElementById('term').value;
	//var queryString = "?loanamt=" + encodeURIComponent(loanamt) + "&rate=" + encodeURIComponent(rate) + "&term=" + encodeURIComponent(term);
	//ajaxRequest.open("GET","calc.php" + queryString, true);
	ajaxRequest.open("GET","calc.php", true);
	ajaxRequest.send(null); 
}

//-->
</script>



<form name='myForm'>
Loan Amt: <input type='text' onChange="ajaxFunction();" name='loanamt' id='loanamt' />  <br />
Rate: <input type='text' onChange="ajaxFunction();" name='rate' id='rate' /> <br />
Term: <select name="term" onChange="ajaxFunction();" id='term' /> <br />
<option label=180 value=180>180</option>
<option label=240 value=240>240</option>
<option label=360 value=360>360</option>
<option label=480 value=480>480</option>
<option label=io value=io>Interest Only</option>
</select> <br />
</form>
<div id='ajaxDiv'>Your results will display here </div>
</body>
</html>

calc.php:

PHP Code:


<?php

include('financial_class.php');

$debug=1;

$loanamt= $_GET['loanamt'];
$rate= $_GET['rate'] * .01;
$term= $_GET['term'];

$f = new Financial;
$rate_a = $rate / 12;

if($debug == 1) {
echo 'Loan Amnt is ' . $loanamt . "<br>";
echo 'Rate is ' . $rate . "<br>";
echo 'Term is ' . $term . "<br>";
echo 'Rate / 12 is ' . $rate_a . "<br>";
}

if($term == io) {
$pymnt = $loanamt * $rate_a;
$pymnt = number_format($pymnt, 2, '.', '');
echo "Payment : $pymnt";
exit;
}
$pymnt = $f->PMT($rate_a,$term,-$loanamt);
$pymnt = number_format($pymnt, 2, '.', '');
echo "Payment : \$$pymnt";

?>

How can I make it so that the variables are passed to the php script properly AND the page automatically displays the output without having to manually refresh the page or use a submit button?

Thanks in advance and sorry if I didn't explain this very well.
-foobar

**foobar** · 08-26-2008, 06:30 PM

Originally Posted by foobar

Hello,

I have the following script and when I use a queryString to pass vars to php the onChange="ajaxFunction" does not seem to work, meaning the page does not get automatically refreshed w/ the output when values are entered into the text box.

When I don't use queryString to pass the vars to php, the php script displays errors b/c it can't read any vars.

Code:

<html>
<body>

<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){
	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){
			//document.myForm.time.value = ajaxRequest.responseText;
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}
	//var loanamt = document.getElementById('loanamt').value;
	//var rate = document.getElementById('rate').value;
	//var term = document.getElementById('term').value;
	//var queryString = "?loanamt=" + encodeURIComponent(loanamt) + "&rate=" + encodeURIComponent(rate) + "&term=" + encodeURIComponent(term);
	//ajaxRequest.open("GET","calc.php" + queryString, true);
	ajaxRequest.open("GET","calc.php", true);
	ajaxRequest.send(null); 
}

//-->
</script>



<form name='myForm'>
Loan Amt: <input type='text' onChange="ajaxFunction();" name='loanamt' id='loanamt' />  <br />
Rate: <input type='text' onChange="ajaxFunction();" name='rate' id='rate' /> <br />
Term: <select name="term" onChange="ajaxFunction();" id='term' /> <br />
<option label=180 value=180>180</option>
<option label=240 value=240>240</option>
<option label=360 value=360>360</option>
<option label=480 value=480>480</option>
<option label=io value=io>Interest Only</option>
</select> <br />
</form>
<div id='ajaxDiv'>Your results will display here </div>
</body>
</html>

calc.php:

PHP Code:


<?php



include('financial_class.php');



$debug=1;



$loanamt= $_GET['loanamt'];

$rate= $_GET['rate'] * .01;

$term= $_GET['term'];



$f = new Financial;

$rate_a = $rate / 12;



if($debug == 1) {

echo 'Loan Amnt is ' . $loanamt . "<br>";

echo 'Rate is ' . $rate . "<br>";

echo 'Term is ' . $term . "<br>";

echo 'Rate / 12 is ' . $rate_a . "<br>";

}



if($term == io) {

$pymnt = $loanamt * $rate_a;

$pymnt = number_format($pymnt, 2, '.', '');

echo "Payment : $pymnt";

exit;

}

$pymnt = $f->PMT($rate_a,$term,-$loanamt);

$pymnt = number_format($pymnt, 2, '.', '');

echo "Payment : \$$pymnt";



?>

How can I make it so that the variables are passed to the php script properly AND the page automatically displays the output without having to manually refresh the page or use a submit button?

Thanks in advance and sorry if I didn't explain this very well.
-foobar

Please disregard. I found the typos with the loanamt var. In some places I had 'loanamnt' when it should have been 'loanamt' and that was the cause of the problem. Typical noob problem.

**Twey** · 08-27-2008, 05:01 PM

alert("Your browser broke!");

Well, no, it probably just doesn't support XHR. How will you deal with that? You need a fallback.

Additionally, http://dynamicdrive.com/forums/showp...39&postcount=1 — 1.1, effectively 1.2, 1.3, 1.4, 3.1, 5.2, 5.3, 5.5.

Thread: can't pass javascript vars to php

Thread Tools

Search Thread

can't pass javascript vars to php

Bookmarks

Bookmarks

Posting Permissions