Primefaces - Ajax - Select Components - jsf-2

Question

I'm using this primafaces example http://www.primefaces.org/showcase/ui/pprSelect.jsf,
but I'm having problem when I put the first p:selectOneMenu as required true, it isn't clean the second p:selectOneMenu when I choose the first option again.
Regards

Answer 1

What happens here is that when you try to "unselect" the first p:selectOneMenu, you end up triggering a validation rule.
You can do what you want by using two remoteCommand tags and JavaScript.
<p:remoteCommand name="makeSelection" process="select" update="suburbs" />
<p:remoteCommand name="clearSelection" process="#this" update="suburbs" >
<f:setPropertyActionListener value="#{null}" target="#{pprBean.city}" />
</p:remoteCommand>
Now you can decide which one to call using a javascript funcion
<p:selectOneMenu id="city" required="true" value="#{pprBean.city}" onchange="selectFunction(this)">
...
function selectFunction(el){
//if el.value is empty you call clearSelection();
//else you call makeSelection();
}
Another common solution is using a commandButton that clears the selection calling something like:
<p:commandButton update="suburbs" (...)>
<f:setPropertyActionListener target="#{pprBean.city}" value="#{null}" />
</p:commandButton>