Question

I have two dropdowns in html. Both dropdowns are getting data mysql first dropdown is “hostgroup” having value like “windows,linux” and second dropdown is “host” having value like”office,home,sidearea,localhost”

Basically I want to do it so when I select “linux” is hostgroup combobox it will filter “host” dropdown box and show only localhost in “host” dropdown and when I select “windows” in hostgroup dropdown it will filter it and remove localhost from host dropdown

My code for filling dropdown in html is,

 html.append("<select id='hosts' name='hosts' style='width: 180px' onchange=\"document.forms['form1'].submit();\">>");
        //if(rs != null)
        //{
       while(rshostgroup.next())
           {
                  html.append("<option value='"+rshostgroup.getString(2)+"'>"+rshostgroup.getString(1)+"</option>");
                //html.append("<option value='web'>web</option>");
            }
        //}

        html.append("<select>");
        html.append("</td>");
        html.append("</tr>"); 

         html.append("<tr>");
        html.append("<td>"); 
        html.append("Host");        
        html.append("</td>");  
        html.append("<td>"); 
        html.append("<select id='hosts' name='hosts' style='width: 180px' onchange=\"document.forms['form1'].submit();\">>");
        //if(rs != null)
        //{
       while(rshost.next())
           {
                  html.append("<option value='"+rshost.getString(2)+"'>"+rshost.getString(1)+"</option>");
                //html.append("<option value='web'>web</option>");
            }
        //}

        html.append("<select>");

Please dont get confuse that what html.append is and what is option value comming from

Actually I am using string builder appending my string builder html in .java(class) file and calling class html appended method in jsp. It is working fine and the option value of drop down is filling from ResultSet rs and rshost having data from mysql.

Answer 1

Firstly using java to build HTML element is a terribly bad idea.
Use JSTL to loop through the dropdown options instead of using Java to spit out HTML code.
Secondly the problem you mention has nothing to do with Java and everything to do with JavaScript.

Well, not entirely true as you might have to make an AJAX request to server get values to populate your secondary dropdown box.

What you need to do is attach a onChange listener for the primary dropdown so that when it changes your javascript code either makes a AJAX call to server to get values for your secondary dropdown box, or use hardcoded values held in some javascript variables.

You will have to loop through the secondary dropdown to remove all previous values and add new dropdown options to it or alternately you can remove the secondary dropdown box entirely and recreate it with the new values based on the selection of the primary dropdown box.
There’s already more than enough articles in the internet so use your fiend Google to find the ones that suits your needs closely.