dynamic related dropdown menus

[5474N]

I am using a MySQL database that contains a category and a sub-category table.
What I need it to do, is dynamically create the first dropdown menu (category), and then when someone chooses a category like computers, the second select box is populated with the results of the sub-category which are related to the category computers. Which means that in the second select box would show sofware, hardware, monitors, etc.
One of my concerns is that this database will end up being really large and I need to keep the loading time to a minimum.
I also want to avoid refreshing the page if possible,I'm thinking Javascript?
Thanks !

Demian

 

[vacunita]

With PHP you'd have to resend the page after the first selection is made, to populate the second dropdown box.

If you want on the fly population go to Javascript.

Of course if you go the javascript way, you have to consider what happens if the user has Javascript disabled in there browser??? This is getting more popular every day. So you would have to come up with something that checks to se whether it is enabled or not, and then if its not enabled do something accordingly.

 

[5474N]

So I've decided that Vacunita was correct when he said "what if the browser has JS disabled", which would render the dropdown useless.
Instead I think it would be wiser to have the second dropdown select box in an iframe that will load itself when the first option is selected in the first box.
any other suggestions?

 

[sleipnir214]

It's not necessary to have it in an iframe. In fact, it'll make it easier to program if both the primary and secondary dropdown are in the same <form>.

Your PHP script will, with no input (it checks for a field with the same name as the primary dropdown), produce the first (primary) dropdown only.

If the script gets input (checking for input from the first dropdown), it will reproduce the original dropdown (with the previously-selected option pre-selected (use a "selected" tag in the right place) and also produce the second dropdown using the previously-provided input from the first dropdown.

You can put "onchange" JavaScript actions on the primary dropdown, but also put submit buttons on the page -- just in case JavaScript is turned off.


Want the best answers? Ask the best questions!

TANSTAAFL!!

 

[vacunita]

Sleipnir has a good point. keeping them in the same page will make populating the second box a lot simpler with a strategically placed IF statement.

When the first dropdown is submitted with the selected value, you can check the value, and then populate the second dropdownbox with it. You can even withhold showing the second dropdown box until the first one is submitted.