Does not rerender in <h:selectOneMenu>

Question

I have two combobox(category and subcategory), i want to render subcategory combobox that is depending on the selection id of category combobox. But, subcategory combobox doesn't render? Here is my code,

<h:panelGrid>
    <h:outputText value="Cateogyr : "/>
    <rich:comboBox defaultLabel="Enter some value" >
      <a4j:support event="onchange" reRender="subCombo" ajaxSingle="true"/>
      <f:selectItems value="#{bookManager.categoryList}" />
    </rich:comboBox>
    </h:panelGrid>

    <h:panelGrid>
    <h:outputText value="Sub Category : "/>
    <rich:comboBox defaultLabel="Enter some value" id="subCombo">
       <f:selectItems value="#{bookManager.subCategoryList}" />
    </rich:comboBox>  
    </h:panelGrid>

I printed out in backing bean where the subcategory combobox is rendered, but it does not appear. Please, if u have any idea, let me know.

Do you want to rerender the subcategory combo box when the value of category combo box is changed? — prageeth
yes. But the subcategory combo box does not rerender.Sorry, I've left out my code. Here is two combo box, — Myo Thu Zar Kyaw
Your code works fine in my environment after wrapping both of the panelGrids with a <h:form> component. — prageeth
I've already added <h:form>, but i can't it to render. And how did u do it? — Myo Thu Zar Kyaw

Luiggi Mendoza Luiggi Mendoza · Accepted Answer · 2012-10-29T06:13:26

It looks like you're working with JSF 1.2 and RichFaces. By the posted code, it looks like you need to do some fixes in your actual code:

You're missing the <h:form> that wraps the data to be sent to the server. Your code should be like this:

<h:form>
    <h:panelGrid>
        <h:outputText value="Category : "/>
        <rich:comboBox defaultLabel="Enter some value" >
          <a4j:support event="onchange" reRender="subCombo" ajaxSingle="true"/>
          <f:selectItems value="#{bookManager.categoryList}" />
        </rich:comboBox>
    <!-- rest of JSF/HTML code... -->
</h:form>

In order to work properly, your bookManager managed bean needs to have Session Scope or Request scope and the @KeepAlive annotation in order to work without problems. For performance hits, I would recommend using Request scopes. Your class should look like this
```
@KeepAlive
public class BookManager {
    //class code...
}
```

Seeing your code, it looks like you're retrieving the bookManager.subCategoryList on the getter of your bean (from database or cached resource). Make sure your managed bean getters and setters are pretty straight forward (like public int getNumber() { return this.number; }) and do not contain any business logic code in it because JSF could call the getter methods more than once. For further info about this, see:

Why JSF calls getters multiple times.

Now, how to solve this problem of retrieving the subcategory list when changing a value in the <rich:combobox>? Use the action component attribute of <a4j:support> invoking a method that retrieves and prepare the data in the bookManager.categoryList.

JSF Code

<a4j:support event="onchange" reRender="subCombo" ajaxSingle="true"
    action="#{bookManager.obtainSubcategoryList}" limitToList="true" />

Java Code

@KeepAlive
public class BookManager {
    public void obtainSubcategoryList() {
        //retrieve the data in this action.
        this.subCategoryList = ...;
    }
    //class code...
}

Does not rerender in <h:selectOneMenu>

1 Answers