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

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.

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 Monkey Patch.
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.

Related

How to fix p:selectOneMenu result item lists moves as when mouse scrolls and not stick to selectOnMenu box

p:selectOneMenu result itemlists are initially shows stick to selectOneMenu dropdown, As when I scroll using mouse scroller the result Itemlist moves up or down as I scroll the mouse.
This p:selectOneMenu I have in the dialog box.
This works fine if I use the h:selectOneMenu. The problem is in p:selectOneMenu (primeface 6.2 version).
I have tried with attribute PanelStyle="position:fixed;" but this not helped. The problem appears only in when I use mouse scroller.
Can somebody please guide me how to fix this.
<p:dialog header="Add User" widgetVar="addUserWidget" id="addUserWidgetId" modal="true">
<p:fragment>
<h:panelGrid columns="2" id="myGridPanelId" width="180px">
<h:panelGroup id="groupPan">
<p:selectOneMenu value="#{myBean.selectedUser}" style="width:140px;">
<f:selectItems
value="#{myBean.userLists}" id="userNameItem"
var="user" itemLabel="#{user.name}" itemValue="#{user.name}">
</f:selectItems>
<f:ajax event="change" execute="#this" render="groupPan" listener="#{myBean.userAdd()}" />
</p:selectOneMenu>
</h:panelGroup>
</h:panelGrid>
<h:panelGrid id="panelBtnGrid">
<p:commandButton ajax="true" value="Add" id="addBtnId" process="#this"
action="#{myBean.saveUser()}" />
</h:panelGrid>
</p:fragment>
</p:dialog>
The result Item list should stick to the p:selectOneMenu dropdown box.

PrimeFaces: selectOneButton is cleared on validation error

I have a wizard tab and a few fields in it. Some of them are required.
There is also a selectOneButton. The problem is when I have some required fields empty and some value selected in selectOneButton - when the validation fails on form submit, it gets "unclicked", i.e. nothing is selected. I suspect that the whole form gets updated but other components still hold the visible value.
What am I doing wrong or maybe someone have had the same problem?
I use PrimeFaces-5.0.RC2
Here is the code:
<p:tab title="Service params" id="firstTab">
<h:panelGrid columns="2">
Name *
<p:inputText value="#{serviceMB.service.name}" label="Name" required="true" maxlength="150"/>
Unit
<p:selectOneButton value="#{serviceMB.service.unit}" converter="serviceUnitConverter"
filter="true" filterMatchMode="contains" label="Unit"
id="unitMenu"
required="true">
<f:selectItems value="#{serviceMB.allServiceUnits}" var="unit"
itemLabel="#{unit.name}"
itemValue="#{unit.code}"/>
<p:ajax event="change"
update=":addServiceForm:priceListPanel"
process="#this"/>
</p:selectOneButton>
</h:panelGrid>
<p:commandButton value="Next" icon="ui-icon-triangle-1-e" iconPos="right" type="button" onclick="PF('serviceWizard').next();"/>
So Unit is the component which value is cleared. I really have no idea why, so I moved to selectOneMenu instead which is less preferable in my case.

Primefaces Tabview resetting inputs

I use primeface 3.5. I have a tabview and each tabview has got inputMasks with a form. I want to reset inputMask when i change the tab. I listen ontabchange event and reset value to="" but bean reset values but View doesn't reset.
<p:tabView id="tabViewOS" binding="#{docData.tabView}" dynamic="true" cache="true" rendered="#{userData.opRendered}">
<p:ajax event="tabChange" listener="#{docData.onTabChange}" immediate="true"/>
<p:tab id="tab1" title="AB">
<h:form id="ABForm">
<h:panelGrid id="abgrid" columns="3" cellpadding="5">
<h:outputText value="AB NO: " />
<p:inputMask value="#{docData.abNo}" mask="999-99999999"
id="ABinput" required="true"
</p:inputMask>
<p:message id="msgAB" for="ABinput" showDetail="true" autoUpdate="true" />
<h:outputText value="" />
<p:commandButton value="GETÄ°R" style="float:right;" ajax="false"
action="#{docData.getDoc}" />
</h:panelGrid>
</h:form>
</p:tab>
public void onTabChange(TabChangeEvent event) {
this.activeTabIndex = tabView.getChildren().indexOf(event.getTab());
FacesContext.getCurrentInstance().renderResponse();
System.out.println(this.activeTabIndex);
this.abNo="";
documents.clear();
}
Try changing the way the event is called. Instead of immediate=true use process="#this".
Change this:
<p:ajax event="tabChange" listener="#{docData.onTabChange}" immediate="true"/>
To this:
<p:ajax event="tabChange" listener="#{docData.onTabChange}" process="#this" update="ABinput"/>
i guess as you said -dynamic="true" cache="false">- is solve my problem. Actually I tested program faulty, my problem has already solved. I think in my case cause of this situation cache=false as documentation said. Thank you.
Have a look at the primefaces documentation on p:tabView. On the one hand you have the property dynamic which specifies if the content of a tab is loaded with AJAX when you select some tag. On the other hand there is the property cache which specifies wheter or not the content of a tab is only dynamically loaded the first time you select a tab.
So regarding this informations setting dynamic="true" cache="false" on the p:tabView should do the trick for you.
Another interesting property for you would be activeIndex. As I see you are setting the index of the active tab manually on tab change. If you can submit tabview on tabchange and you have set activeIndex="#{docData.activeTabIndex}" the active tabindex is tracked automatically. Have a look at the documentation if this fits your requirements.

jsf standard converter along with primefaces select one menu

When the "select" option of the select one menu is selected, the default value is saved in DB as 0. Can I change this to null?
The value of select one menu is bound to a bean property. To achieve this, I have used the converter attribute of the select one menu component. But it does not seem to convert empty string to null. What am I missing?
<p:panelGrid columns="2" >
<p:outputLabel value="District" />
<p:selectOneMenu value="#{cJData.cJ.dC}" converter="javax.faces.Long">
<p:ajax listener="#{cJActionHandler.selectDC}"/>
<f:selectItem itemLabel="Select" itemValue="" />
<f:selectItems value="#{cJData.DCs}" var="coun"
itemLabel="#{coun.name}" itemValue="#{coun.id}" />
</p:selectOneMenu>
</p:panelGrid>
Use the following
<f:selectItem itemLabel="Select" itemValue="#{null}" />
As the docs of LongConverter#getAsObject say - this is the method which is called when you submit th value - the Long converter will convert only null to null.

Issue in selectOneMenu in primefaces?

I am using primefaces 3.2 and i have used selectOneMenu from primefaces.When i drag and drop somethine into the selectOneMenu box it displaying some url(for example drag and drop the image into the selectOneMenu).Text box allows that drag and drop but why selectOneMenu.How to avoid that.
<p:selectOneMenu value="#{buttonBean.number}">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItem itemLabel="Option 1" itemValue="1" />
<f:selectItem itemLabel="Option 2" itemValue="2" />
<f:selectItem itemLabel="Option 3" itemValue="3" />
</p:selectOneMenu>
Primefaces 3.2 uses an html input to display the selected value.
If you can, update to 3.4. The helper input is gone, no this issue.
You can test it in the showcase.