How can i have a form... with say 2 drop down lists

one is category and the other is sub category

i want sub category to be blank when the page loads, and then when someone selects a category it will query the db and get the sub categories for that category and display them in the subcat.


I know how to make the sql queries and stuff, just not sure how to get the second list box to update every time category changes?


im guess ajax or js or something else i dont know lol?

any help would be great thanks

This is definitely something you will want to use AJAX for.

Here's a link to a basic tutorial that should get you started:

http://www.webmonkey.com/tutorial/Build_an_Ajax_Dropdown_Menu/examples

Just make sure you validate on the recieving page that the two items match up.

Yes you can use Ajax, here is a rough guide

<form action="" name="form1">
Main Category: <select name="maincat" onchange="getSubCat('findsubcat.php?mainID='+this.value)">
<option value="">Select Category</option>
<option value="1">Item 1</option>
<option value="2">Item 2</option>
</select>
<br />Sub Cat : <div id="subcatdiv">
<select name="select">
<option>Select Sub Cat</option>
</select>
</div>
</form>
javascript function called "getSubCat"
function getSubCat(strURL)
{
var req = getXMLHTTP(); // fuction to get xmlhttp object
if (req)
{
req.onreadystatechange = function()
{
if (req.readyState == 4) {
if (req.status == 200) {
document.getElementById('subcatdiv').innerHTML=req.responseText;
}
else
{
document.getElementById('subcatdiv').innerHTML="There was a problem with the request";

}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}

the file called findsubcat.php should do your php databse abstraction, something like this

<?php
......
$query="select subcat from subcat_tb where subcat_maincatID=$_GET['mainID']";
$result=mysql_query($query);
.......
?>
<select name="select">
<option>Select Sub Cat</option>
<?php while($row=mysql_fetch_array($result)) { ?>
<option value="<?php =$row['Subcat'];?>"><?=$row['SubcatName]?></option>
<?php } ?>
</select>

You could just load all variables into a array when you do your first pageload and then there is no reason to use ajax. :)

WebNaz had a good go at it :) Use his… you want it to be simple and clean coding, which he used!