Passing variables between Ajax and PHP

learningPHP1 · February 24, 2010

Hello All,

I'm working on a script which I'm sure has been done many times, using 3 dropdown list box to select country, state, and city.

Using PHP, AJAX, and MYSQL

Whats working:

I'm able to populate and select a country. At the same time I'm able to populate the state based on the country selection and select a state.

Whats not working:

not able to populate the city dropdown box.

- not getting any errors to work with.

the state variable is passed but the country variable isnt getting passed.

I believe the problem is in "function getCity(countryId,stateId)" ajax script

Any help you can provide would be greatly appreciated.

<html>
<head>
<title> learning</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript" type="text/javascript"> 

function getXMLHTTP() 
{ //fuction to return the xml http object
	var xmlhttp=false;	
	try{ xmlhttp=new XMLHttpRequest(); }
	catch(e) {	
		try{ xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");}
			catch(e){
			try{ xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
				catch(e1){ xmlhttp=false;	}
			}
		}
	return xmlhttp;
    }

function getState(countryId) 
{	var strURL="findprovstate.php?country="+countryId;
var req = getXMLHTTP();
if (req) 
{	req.onreadystatechange = function() 
	{	if (req.readyState == 4) 
		{	if (req.status == 200) 
			{	document.getElementById("statediv").innerHTML=req.responseText;	}
			else 
			{   alert("There was a problem while using XMLHTTP:\n" + req.statusText);	}
		}				
	}			
	req.open("GET", strURL, true);
	req.send(null);
}		
}

function getCity(countryId,stateId) 
{	var strURL="findCity.php?country="+countryId+"&state="+stateId;
var req = getXMLHTTP();
if (req) 
{	req.onreadystatechange = function() 
	{	if (req.readyState == 4) 
		{	if (req.status == 200) 
			{	document.getElementById('citydiv').innerHTML=req.responseText;	} 
			else
			{	alert("There was a problem while using XMLHTTP:\n" + req.statusText);	}
		}				
	}			
	req.open("GET", strURL, true);
	req.send(null);
}
}

</script>
</head>
<body>
<form method="post" name="form1">
<table border="0" cellpadding="0" cellspacing="0" width="60%"><tbody>

  <tr>
   <td width="150">Country</td>
   <td width="150">
    <select style="background-color: #ffffa0" name="country" onchange="getState(this.value)">';
	<?php
		require_once("C:\wamp\www\servicebid\inc\FindCountry.php");
		while($row=mysqli_fetch_assoc($result)) 
		{if($nextcountry = $row['country'])
			{ echo '<option value="' . $row['country'] . '">' . $row['country'] . '</option>'; }
		}
		?>
</select></td>
  </tr> 
  
  
<tr style="">
    <td>State</td>
    <td >
   <div id="statediv">
       <select name="state" >
            <option>Select Country First</option>
           </select>
   </div>
</td>
  </tr>

<tr style="">
    	<td>City</td>
    	<td ><div id="citydiv">
		<select name="city">
			<option>Select State First</option>
        	</select>
		</div>
	</td>
  	</tr>
  
</tbody>
</table>
</form>
</body>
</html>

The colde is used to populate the state/province.

<?php
require_once("C:\wamp\www\servicebid\inc\connection.php");
$country = $_GET['country'];
$provinceState_query = "SELECT DISTINCT province from tb_location where country = '$country'";
$result= mysqli_query($dbconnect, $provinceState_query) or die('<br/>Error reading Database:'.mysql_error());
?>

<select name="state" onchange='getCity("<?=$country?>",this.value)'>
<option>Select State</option>
<?php
while($row=mysqli_fetch_assoc($result)) 
	{ echo '<option value="' . $row['province'] . '">' . $row['province'] . '</option>'; }
?>
</select>

The code below is used to populate the city dropdown list box.

at this stage the state is comming through but the country isnt.

<?php
require_once("C:\wamp\www\servicebid\inc\connection.php");
$countryId = $_GET['country'];
$stateId = $_GET['state'];

echo '<br> ==>:1'.$countryId;
echo '<br> ==>:2'.$stateId;	
$city_query = "SELECT city from tb_location WHERE country ='$countryId' AND province='$stateId'";
$result= mysqli_query($dbconnect, $city_query) or die('<br/>Error reading Database:'.mysql_error());

while($row=mysqli_fetch_array($result)) 
{  //testing
echo 'br>'.$row['city'];
}
?>
<select name="city">
<option>Select City</option>
<?php 
while($row=mysql_fetch_array($result)) 
{	echo '<option value="' . $row['city'] . '">' . $row['city'] . '</option>'; }
?>
</select>

aleX_hill · February 24, 2010

A couple of things.

1. is there a reason you mix mysqli_fetch_array and mysql_fetch_array in the last file?

2. Try making the query mysql_fetch_array($result, MYSQL_ASSOC) or use mysql_fetch_assoc

3. Does your testing code print out the correct values?

learningPHP1 · February 24, 2010

Hello Alex_Hill

Yes all the test scripts work. since then I added a few Alarts in the javascripts to narrow down the problem.

The problem seem to be still the same. the following coded just not taking the country variable.

I added a few echo statements (echo $country = $_GET['country'] to disply the content and its there. its just the javascript isnt taking it or the format is incorrect.

select name="state" onchange="getCity([color=red][b]'<?=$country ?>'[/b][/color],this.value)">
<option>Select State</option>

the code below isn't receiving the country variable.

the state comes through but not the country.

function getCity(country,stateId) 
{	alert('Country==>:' + country + ' State==>: ' + stateId + '.');

var strURL="findCity.php?country="+country+"&state="+stateId;
var req = getXMLHTTP();
if (req) 
{	req.onreadystatechange = function() 
	{	if (req.readyState == 4) 
		{	if (req.status == 200) 
			{	document.getElementById('citydiv').innerHTML=req.responseText;	} 
			else
			{	alert("There was a problem while using XMLHTTP:\n" + req.statusText);	}
		}				
	}			
	req.open("GET", strURL, true);
	req.send(null);
}
}

Sign In

Passing variables between Ajax and PHP

Recommended Posts

learningPHP1

Link to comment

Share on other sites

aleX_hill

Link to comment

Share on other sites

learningPHP1

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information