Filtering dropdown list

dinox's Avatar, Join Date: Mar 2010
Newbie Member
Hi there,

I've a question about dropdown list. How to get the filtered list (in dropdown) from database? Let's say there are 2 dropdowns. Second dropdown result list will depend on what has been chosen in the First dropdown. Example, if I choose America (in 1st dropdown), then the 2nd dropdown list will show ONLY states in America. I've didn't have problem with this. The problem is when the page (that consists these dropdowns) is loaded. For more clear view, here an example. I choose America (in 1st dropdown), then in the 2nd dropdown I choose Alaska (which is one of the state in America). I save this data in database. After that, I reload the page and found the same data as I inserted. When I try to select another state, says Washington, it list all the state in the world not only in America. I need to select another country first, and then reselect America, after that the list consist only states of America. Any ideas how to make it better? Fyi, the list is from database, not in any jsp.

Any help would been appreciated...
0
virxen's Avatar, Join Date: Nov 2009
Pro contributor
first of all post the database here

your post is in java thread ,you want an answer in java?
if so ,where is your code so far?
0
dinox's Avatar, Join Date: Mar 2010
Newbie Member
Here are the list

1. 1st Dropdown
Code:
    COUNTRY_ID   COUNTRY
    01                  AMERICA
    02                  AUSTRALIA
    03                  BELGIUM
    04                  LUXEMBOURG
    05                  RUSSIA
2. 2nd Dropdown
Code:
    COUNTRY_ID   STATE_ID       STATE
    01                  0101               ALASKA
    01                  0102               WASHINGTON
    01                  0103               TEXAS
    02                  0201               VICTORIA
    02                  0202               QUEENSLAND
    03                  0301               WEST-VLAANDEREN    03                  0302               ANTWERPEN
    04                  0401               LUXEMBOURG
    05                  0501               MOSCOW
    05                  0502               ST. PETERSBURG
and here's the coding (javascipt)
Code:
<h:panelGroup>
      <h:selectOneMenu id="country" required="true" value="#{world.country}">
            <f:selectItem itemLabel="#{msgreg['registration.new.choose']}" itemValue="" />
                                                                    <f:selectItems value="#{listCountry.all}" id="a4" />
                                                                    <t:jsValueChangeListener for="District"
                                                                        expressionValue="updateDropDown($srcElem, $destElem, '#{world.state}', 'list_state');" />
                                                                </h:selectOneMenu>
                                                                <h:outputText value="&nbsp" escape="false" />
                                                                <h:outputText value="*" styleClass="formnotes" />
                                                            </h:panelGroup>

                                                            <h:panelGroup>
                                                                <h:selectOneMenu id="State" required="true"
                                                                    value="#{world.state}">
                                                                    <f:selectItem
                                                                        itemLabel="#{msgreg['registration.new.choose']}"
                                                                        itemValue="" />
                                                                    <f:selectItems value="#{listStateNew.allState}" />
                                                                </h:selectOneMenu>
                                                                <h:outputText value="&nbsp" escape="false" />
                                                                <h:outputText value="*" styleClass="formnotes" />
                                                            </h:panelGroup>

function updateDropDown(parent, child, chosen, basicArrayName)
{
    var value;
    var arrayItem;
    var arrayName;
    var instruction;
    if (parent == null) return;
    if (child == null) return;
    value = parent.value;
    arrayName = "";
    arrayName = arrayName + basicArrayName;
    arrayName = arrayName + "_";
    if (value == '')
    {
        //empty array
        arrayItem = new Array();
    }
    else
    {
        arrayName = arrayName + value;
        instruction = "arrayItem = " + arrayName;
        eval(instruction);
    }
    if (chosen == '')
    {
        chosen = child.value;
    }
    loadItem(arrayItem, child, chosen);
}

function loadItem(arrayItem, control, value)
{
    var itemLength;
    var lastItem;
    itemLength = arrayItem.length;

    while (itemLength < control.options.length) {
        lastItem = control.options.length - 1;
        control.options[lastItem] = null;
    }
    control.options[0] = new Option('-', '');
    var foundLocation = 0;
    for (var i = 0; i < itemLength; i++) {
        var opt = eval("new Option" + arrayItem[i]);
        if (opt.value == value) {
            foundLocation = i+1;
        }
        control.options[i+1] = opt;
    }
    control.selectedIndex = foundLocation;
}

Last edited by shabbir; 25Mar2010 at 09:52.. Reason: Code blocks