Dynamic Drop Down Lists.

[Mike Troxclaire]

Hello Gurus,

I am trying to build a JSP page with two drop down lists. The values in the second drop down list should be loaded from the database based on the value selected in the first drop down list. I have two tables 1st one is Customers and in that I have fields : ItemId and CustomerId, my second table is Items and in that I have fields : ItemId and Itemname. So, in my first drop down list I need the values from ItemId in the Customers table to be loaded when the user first accesses the page and when an ItemId is selected in the first drop down list it should pull the Itemname(s) from the Items table and populate the second drop down list. Hope that makes sense. Any help in this matter would be much appreciated.

Cheers,

Mike.

[Bear Bibeault]

This has been discussed many times in this and the HTML forum. Poke around a bit and you will find lots of good ideas.

[Ben Souther]

Mike,
I've just added a demo project that shows how to do this using an MVC pattern.
It's packaged as a war file so you can just drop it into a running instance of Tomcat and test it.

http://simple.souther.us/not-so-simple.html

[Sri Basavanahally]

Ben,

You use two different forms to do this. I have a case where the drop downs in question are part of one big form. How do I handle such a case ?

Thanks for your help !

-Sri

[Ben Souther]

Both select lists are in the same form.

 
    <form method="post" name="holiday_form" action="HolidaySelector">
      <table width="40%">
        <tr>
          <td width="50%">
            <select name="month" onchange="document.holiday_form.submit()">
              <option value="">Select one</option>
              <jsp:getProperty name="holidayBean" property="monthsAsOptions" />
            </select>
          </td>
          <td width="50%">
            <select name="holiday" onchange="document.holiday_form.submit()">
              <option value="">Select one</option>
               <jsp:getProperty name="holidayBean" property="holidaysAsOptions" />
            </select>
          </td>
        </tr>
      </table>
    </form>
 

 

[Sri Basavanahally]

Thanks Ben ! I guess it works the same, then.

Now, you do some logic in the back-end to keep the drop down item the user selected to be selected when the page comes back.

So, if I have other form input text fields, checkboxes and what not, that the user has entered, before I send the request to the server to populate the second drop-down, I guess I have to send them back as well, so that the form does not get "reset". Am I right ?

[Ben Souther]

Every time you submit the form, the selected value from each select list gets send with the rest of the form information.

In that demo, I build the select list option tags in an option and then read all of them as one bean property but you could implement the same logic with JSTL and EL or (dare I say it...) scriptlets in your JSP.

    public String getHolidaysAsOptions(){
                                                                                                          
        if(null == this.db || -1 == this.month)
            return "";
                                                                                                                  
        ArrayList holidays = db.selectByMonth(this.month);
                                                                                                          
        StringBuffer sb = new StringBuffer();
        for(int i = 0; i < holidays.size(); i++){
            Holiday holiday = (Holiday)holidays.get(i);
            sb.append("<option value=\"");
            sb.append(holiday.getKey());
            sb.append("\"");
            [B]if(holiday.getKey().equals(this.key)){
                sb.append(" selected");
            }[/B]
            sb.append(">");
            sb.append(holiday.getName());
            sb.append("</option>\n");
        }
        return sb.toString();
    }
 
 
 
 
  

[ May 18, 2005: Message edited by: Ben Souther ]

[Sri Basavanahally]

Thank you.

I am thinking of collecting the selected values(including text fields, checkboxes, radio buttons, etc) in a bean( I am using Struts) and placing the bean in request scope after the first form submit. I can use these values in the JSP to pre-popluate the form when it gets displayed the second time.

Is there an easier way ? :-) I will look into JSTL and EL.