Dynamic Dropdown

[karenn1]

My database looks as follows:

 

ID         Venue_Area             Venue_Name             Rep            Product

1          Cape Town              Newscafe                 John           Benson & Hedges
2          Cape Town              Buena Vista              Lisa            Dunhill Lights
3          Durban                  Carlyle's Club            John

 

How can I make a dynamic three-level dropdown for the above? Basically, I want users to select area from the first dropdown, the second would then only display Newscafe and Buena Vista (ie, the two Venues attached to that area). If Newscafe is selected the third dropdown would then display which rep is attached to both Venue Area and Venue Name. The above is just a sample, I have a much larger database with quite a few duplicates because there are several products available per venue. Does anybody have an idea? I had a look on the web but couldn't really find anything that's suitable for the above.

 

Any help would be greatly appreciated!!!

 

 

Thanks,

Karen

[kernelgpf]

Mm, I had problems with this awhile back- I found and edited some free code to fit my problem [if a dragon was chose, give breed dropdowns], and I don't have time to edit it to fit your DB, but it'll definitely set you on the right track. =]

 

-Alyssa

 

Feel free to message me with questions.

 

<script name="Javascript">
function setOptions(chosen) {
var selbox = document.myform.opttwo;

selbox.options.length = 0;
if(chosen == " "){
selbox.options[selbox.options.length] = new Option('Please select a creature above',' ');
}
if (chosen == " " || chosen == "fairies" || chosen == "hippogriffs" || chosen == "unicorns" || chosen == "pegasus") {
  selbox.options[selbox.options.length] = new Option('Ignore this box',' ');

}
if (chosen == "dragons") {
  selbox.options[selbox.options.length] = new Option('fire','fire');
  selbox.options[selbox.options.length] = new Option('ice','ice');
  selbox.options[selbox.options.length] = new Option('shade','shade');
  selbox.options[selbox.options.length] = new Option('water','water');
  selbox.options[selbox.options.length] = new Option('air','air');
  selbox.options[selbox.options.length] = new Option('earth','earth');
  selbox.options[selbox.options.length] = new Option('poison','poison');
  selbox.options[selbox.options.length] = new Option('light','light');
}
}
</script>

<form method=post name=myform action=file.php>
Species: <select name="optone" size="1"
onchange="setOptions(document.myform.optone.options[document.myform.optone.selectedIndex].value);">
<option value=" " selected="selected"> </option>
<option value=dragons>dragon</option>
<option value=fairies>fairy</option>
<option value=hippogriffs>hippogriff</option>
<option value=unicorns>unicorn</option>
<option value=pegasus>pegasus</option>
</select><br />
Breed: <select name="opttwo" size="1">
<option value=" " selected="selected"></option>
</select></form>

[karenn1]

Thanks Alyssa! I see you hard coded "pegasus", "fairies", "unicorn", etc into the select list but I need this to be dynamically pull in variables from my database. How do I change the code to do this? Also what does the "ice, ice", "fire, fire", etc bit refer to.

 

 

 

Thanks,

Karen

[ludjer]

you will need to use ajax for that.

i am not to sure on how to do it but you can try search google for that

[karenn1]

I've tried searching on Google but found nothing. Is there anyone that can build something like this for me? Or maybe point me in the right direction? Alyssa, did you see my query above?

 

It would be GREATLY appreciated!!