Hey,

I'm trying to create a dynamic drop down box where the first drop down box populates the second drop down, but it isn't working. I have two tables;
pricelist with fields,
-id
-groupname
-item
-price
groups with fields,
-id
-groupname

I've got the code and to me it looks as though it completely works, but i think its the fact that two of the fields have the same name, and it's causing problems.

index.php

<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>
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{
				req = new ActiveXObject("Msxml2.XMLHTTP");
				}
				catch(e1){
					xmlhttp=false;
				}
			}
		}
		 	
		return xmlhttp;
	}
	
	
	
	function getItem(strURL) {		
		
		var req = getXMLHTTP();
		
		if (req) {
			
			req.onreadystatechange = function() {
				if (req.readyState == 4) {
					// only if "OK"
					if (req.status == 200) {						
						document.getElementById('itemdiv').innerHTML=req.responseText;						
					} else {
						alert("There was a problem while using XMLHTTP:\n" + req.statusText);
					}
				}				
			}			
			req.open("GET", strURL, true);
			req.send(null);
		}
				
	}
</script>

<?
require_once('../sqlconnect/connect.php');
?>

</head>

<body>

<form method="post" action="" name="form1">
<table width="60%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="25">Group</td>
    <td  width="15"><select name="group" onChange="getItem('findcity.php?group='+this.value)">
	<option value="">Select Group</option>
	
<?
//make query
	$query ="SELECT * FROM groups";
	$result = mysql_query($query);
//run

$query = mysql_query('SELECT * FROM groups');
if(mysql_error())
{
print(mysql_error());
}

while($row = mysql_fetch_array($query)) 
{
echo '<option value="'.$row["groupname"].'  ">'.$row["groupname"];
} 

?>

        </select></td>
  </tr>
  <tr style="">
    <td>Item</td>
    <td ><div id="itemdiv"><select name="item">
	<option>Select Item</option>
        </select></div></td>

findcity.php

<select name="item">
<option value="">Select Item</option>

<? 

//if so, connect to database
	require_once('../sqlconnect/connect.php');

$query="SELECT item FROM pricelist WHERE groupname=$groupname";
$result=mysql_query($query);

$query = mysql_query('SELECT * FROM pricelist');
if(mysql_error())
{
print(mysql_error());
}

while($row = mysql_fetch_array($query)) 
{
echo '<option value="'.$row["item"].'  ">'.$row["item"];
} 

?>

</select>

When i select an option in the first drop down box, it populates the second with all the values in the table, not just the selected ones.

Cheers

Well for both files you aren't ending your option tag when you generate them, it may not be what's causing the problem but it's incorrect nonetheless

Yea i know, i purposely left them off, to save space.
What other problems have you seen with my code?

Sorry, I actually laughed at that. Leaving off the end tag makes the HTML invalid, and can cause cascading errors.

@mortalex

Oh Shit!! I got the same problem using ajax... I believe that your coding is perfectly correct. This shit works only the first time page loads :(

@mortalex This same coding will work very correctly if you use it not in table (in open page or outside of table)

Any other suggestion or solution..?

This article has been dead for over six months. Start a new discussion instead.