sladej
asked on
JSP dynamically populating drop box
I have a jsp that contains a drop down box(1) on it. I have been asked to add another drop down box(2) that is populated from a database based on what is selected from the 1st box(1). The first drop down box(1) is loaded when the page is loaded. I can't seem to find a solution that allows the second box(2) to be loaded dynamically after the user has selected an item from box #1. Does anyone have any ideas.
i think the good option is using javascript
place the contents that are going to be displayed in the dropbox #2 in the javasript function (this method is uesd in the site msdn.microsoft.com).
when there is a selection in the dropbox #1 call a function of javascipt that has the data from the database changes the data in dropbx #2.
i think it will solve ur problem and there will be no server/client communication for just one dropbox
place the contents that are going to be displayed in the dropbox #2 in the javasript function (this method is uesd in the site msdn.microsoft.com).
when there is a selection in the dropbox #1 call a function of javascipt that has the data from the database changes the data in dropbx #2.
i think it will solve ur problem and there will be no server/client communication for just one dropbox
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
atifmehdi just suggested to put all possibilities to the client to avoid the roundtrip. Summarized to the following:
1. load all the options for the first drop down box.
2. load all possibilities for the second drop down box
and encode them in a Javascript function.
Example:
Drop down box has the options Fruit, Vegetable and Meat. Second drop down box has the options: Apple, Banana, Mango for the first option, Cauliflower, Porree and Okra for the second option and Pork, Lamb and Crocodile for the third option.
Now, for the second drop down box you need to load all nine possibilities (three groups of three options each) and put them in a Javascript function to populate the second drop down box dynamically.
The problem with this approach is that it is not feasible with a very big range of possibilities. Say, you have a hundred options for the first drop down box and then additional fifty options each for the second drop down box. Then you need to load all five thousand options from the database.
SUMMARY:
Solution 1: Reload the page for the second drop down box.
Solution 2: Load all option and populate dynamically with Javascript.
It's up to you, what makes more sense.
1. load all the options for the first drop down box.
2. load all possibilities for the second drop down box
and encode them in a Javascript function.
Example:
Drop down box has the options Fruit, Vegetable and Meat. Second drop down box has the options: Apple, Banana, Mango for the first option, Cauliflower, Porree and Okra for the second option and Pork, Lamb and Crocodile for the third option.
Now, for the second drop down box you need to load all nine possibilities (three groups of three options each) and put them in a Javascript function to populate the second drop down box dynamically.
The problem with this approach is that it is not feasible with a very big range of possibilities. Say, you have a hundred options for the first drop down box and then additional fifty options each for the second drop down box. Then you need to load all five thousand options from the database.
SUMMARY:
Solution 1: Reload the page for the second drop down box.
Solution 2: Load all option and populate dynamically with Javascript.
It's up to you, what makes more sense.
1. Populate first drop down box from database, don't populate second drop down box.
2. When user selects a value, reload the same page with an additional parameter and populate the second drop down box.
In step 1 the parameter wasn't set, so the JSP knows not to populate the second box.
Contra: Roundtrip to server but just now I don't know how to avoid it or else you would need to load all possibilities to the client.