Uncheck all p:selectManyCheckbox checkboxes from a p:selectOneRadio item

Question

How could I Uncheck all checkboxes from selectManyCheckbox when choosing "No" from selectOneRadio

<p:selectOneRadio id="radio" value="#{myView.myObject.myBoolean}">
<f:selectItem itemLabel="Si" itemValue="#{true}"/>
<f:selectItem itemLabel="No" itemValue="#{false}"/>
<p:ajax process="radio" event="valueChange" update="@widgetVar(displayPanel)"/>
<p:ajax update="@this"/>
</p:selectOneRadio>

<p:panel widgetVar="displayPanel">
<p:outputPanel rendered="#{myView.myObject.myBoolean}">
<p:selectManyCheckbox widgetVar="mySelections" value="#{myView.myObject.myObjectList}" layout="grid" columns="8" styleClass="grid-checkbox">
<p:ajax update="@this"/>
<f:selectItems value="#{myView.things}" var="thing" itemLabel="#{thing.idThing}" itemValue="#{thing.thing}"/>
</p:selectManyCheckbox> 
</p:outputPanel>
</p:panel>

As seen, update="@widgetVar(displayPanel)" will show the outputPanel when myBoolean is true and viceversa.

What I need to achieve is to uncheck all the already selected checkboxes (mySelections) when myBoolean is false (by selecting "No" from selectOneRadio above.

Possible? If so, Could you please show me how, I'm just starting on PrimeFaces.

Answer 1

Normally, the easiest way would be using the client side API uncheckAll . However, there is a bug . But, I've fixed it. So you can wait for PrimeFaces 12.0.0-RC3 or create a MonkeyPatch.

A simple demo would be:

<p:selectOneRadio id="radio" value="#{testView.bool}"
                  onchange="if(this.value==='false'){PF('mySelections').uncheckAll()}">
    <f:selectItem itemLabel="Si" itemValue="true"/>
    <f:selectItem itemLabel="No" itemValue="false"/>
</p:selectOneRadio>

<p:selectManyCheckbox widgetVar="mySelections" value="#{testView.strings}">
    <f:selectItems value="#{['a','b','c']}"/>
</p:selectManyCheckbox>

This eliminates the need to use Ajax.

See also:

• MonkeyPatching: PrimeFaces widgets extend/override