Ajax – p:ajax update not working with p:selectBooleanCheckbox

ajaxjsfprimefaces

I'm using JSF 2 and Primefaces 4 and have the following issue:

I've got the following code in my XHTML:

<h:form id="form">
<table>  
    <tr id="formats">
        <td>Formats</td>
        <td>
            <p:selectBooleanCheckbox value="#{bean.entity.formatted}">
                <p:ajax event="change" update="formatsSelect" /> 
            </p:selectBooleanCheckbox>
            <p:selectOneMenu id="formatsSelect" rendered="#{bean.entity.formatted}">
                <f:selectItems value="#{bean.formats}" />
            </p:selectOneMenu> 
        </td>
    </tr>
</table>
</h:form>

It outputs a checkbox and a select menu and what I expect is that when I check the checkbox the select menu should appear and should disappear when I uncheck it…. but nothing happens, I check and uncheck it and the select menu is unaffected.

In theory this should work since the selectBooleanCheckbox value is bound to the entity.formatted boolean value and the rendered value in the selectOneMenu is bound to the entity.formatted value and the p:ajax points to the correct id in the update attribute and the event is correct. This last bit I know since I created a listener in my bean that printed the value of formatted:

public void changeListener(){
    System.out.println(this.entity.isFormatted());
}

And changed the p:ajax to:

<p:ajax event="change" update="formatsSelect" listener="#{bean.changeListener}" /> 

And it printed the value of formatted in the console.
What am I doing wrong?

Best Answer

Since you used rendered on the component (p:selectOneMenu id="formatsSelect") and updating the same component, it wont work.

Because that component might not have been added to/present in component tree by the time you are updating.

So use a h:panelGroup around it and update it and use rendered on p:selectOneMenu.

<p:selectBooleanCheckbox value="#{bean.entity.formatted}">
      <p:ajax event="change" update="formatsSelectPG" /> 
</p:selectBooleanCheckbox>

<h:panelGroup id="formatsSelectPG">
      <p:selectOneMenu id="formatsSelect" rendered="#{bean.entity.formatted}">
            <f:selectItems value="#{bean.formats}" />
       </p:selectOneMenu> 
</h:panelGroup> 
Related Topic