Reset ace:comboBox value when another comboBox value is changed

Question

I have 2 ace:comboBox components into a JSF page:

        <ace:comboBox id="combo1" value="#{controller.value1}">
            <f:selectItems value="#{controller.values1}" />
            <ace:ajax event="valueChange" listener="#{controller.valueChange()}"/>
            <ace:ajax event="blur" listener="#{controller.valueChange()}"/>
        </ace:comboBox>

        <ace:comboBox id="combo2" value="#{controller.value2}">
            <f:selectItems value="#{controller.values2}" />
        </ace:comboBox>

When I change the value of combo1, the value of combo2 has to be reset to empty. Here is the code of my controller's function:

public void contextChanged() {
    String selectedValue1 = getValue1();
    if(StringUtils.isNotBlank(selectedValue1)) {
        // populate combo2 select items
    } else {
        setValues2(null);
    }
    setValue2(null);
}

But when I change the value of combo1, nothing happens to the value combo2.

Answer 1

The solution was to add the tag to combo2:

        <ace:comboBox id="combo2" value="#{controller.value2}">
            <f:selectItems value="#{controller.values2}" />
            <ace:ajax/>
        </ace:comboBox>