On a web site, I need to do this:

Have two drop down boxes. Depending on what you select in the first drop down box, the 2nd drop down populates with certain choices.

How could I do this?

they have it on this page http://www.cardomain.com/

basically you have a file with all the possible options setup in javascript array, and then update the second on select of the first

heres a stripped down working example
http://www.doriangeorge.com/tmp/select.html

heres a stripped down working example
http://www.doriangeorge.com/tmp/select.html

ok?

just right click on the page, view source and there you have?!

Peace,

Try: http://www.irt.org/script/237.htm

Dynamic Dropdown Menus: http://siteFwd.com/VS
Describes a method whereby one dropdown menu will effect the contents of another dropdown menu, for ALL JavaScript enabled browsers.

Dropdown Menus #3: http://siteFwd.com/8Y
Covers some advanced uses of dropdown menus: adding an additional entry passed from another page, and locating an entry based on a value entered in a text field.

Dropdown Menus #2: http://siteFwd.com/3F
Describes multiple select options, and how to add, remove and replace options.

You could use ajax to do this though its a little more complicated then using just javascript for the whole thing. what you would do is have a array for the first dropdown box and then when you sellect that you use ajax to call the php script again and get the contents for the next dropdown box. Ajax can be very complicating at first but when you get used to it its a really good tool to have.
more info on ajax is here:
www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm (http://webhostingtalk.com/www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm)

ermm use view source and here's the code



<form name="doublecombo">
<select name="make" onchange="redirect(this.options.selectedIndex)">
<option value="0">Select</option>
</select>
<select name="model" disabled="disabled">
<option value="0">Model:</option>
</select>
</form>
<Script language=javascript>
var makes = new Array();
var models = new Array();

makes[0] = "Acura";
makes[1] = "Alfa Romeo";
makes[2] = "AMC";

for (i=0;i<makes.length;i++)
models[i] = new Array();

models[0][0] = "CL";
models[0][1] = "EL";
models[0][2] = "Integra";
models[1][0] = "145";
models[1][1] = "146";
models[1][2] = "147";
models[2][0] = "Alliance";
models[2][1] = "Ambassador";
models[2][2] = "AMX";
models[2][3] = "Classic";



var temp=document.doublecombo.model

/*initialize the drop down Makes box */
for(j=0;j<makes.length;j++){
document.doublecombo.make.options[j+1] = new Option(makes[j], makes[j]);
document.doublecombo.make.options[0].selected=true;

/*initialize the drop down Models box */
temp.options[0] = new Option("All models", "all_models")

}

function redirect(x){

/* clear out the models drop down */
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null

temp.options[0] = new Option("All models", "all_models")

/* if the user has selected the "Make" option, disable the drop down boxes */
if(x==0){
temp.disabled = true;
return;
}

for (i=1;i<models[x-1].length+1;i++){
temp.options[i]=new Option(models[x-1][i-1],models[x-1][i-1])
}

temp.options[0].selected=true
temp.disabled = false

appendurl(models[x-1].length);
}

function appendurl(x)
{
if(document.doublecombo.model.value!="all_models" || x==0)
{
document.doublecombo.action += "/search_results.cgi";
}
}

</script>