JSF selectonemenu does not update - jsf

i am beginner in JSF ,i have a problem with selectonemenu item.When i choose the an item ,for example ' FirstLabel',outputpanel should be shown.However ,selectone menu does not update my choice.I use primefaces 3.1 library.How can i solve this problem.Thanks for helps.
<p:selectOneMenu value="#{denemeView.str}" effect="fold" editable="true" >
<f:selectItem itemLabel="Please choose!." itemValue="" />
<f:selectItem itemLabel="FirstLabel" itemValue="1" />
<f:selectItem itemLabel="SecondLabel" itemValue="2" />
<p:ajax process="#this" update=":Form2:panel1"/>
<p:ajax process="#this" update=":Form2:panel2"/>
</p:selectOneMenu>
</p:outputPanel>
<p:outputPanel id="panel1" rendered="#{denemeView.str=='1'}">
<h:outputText value="Output: * " />
<p:inputText id="out" value="#{denemeView.islem}" />
</p:outputPanel>
<p:outputPanel id="panel2" rendered="#{denemeView.str=='2'}">
<h:outputText value="True choice! " />
</p:outputPanel>

If a JSF component has rendered="false" set then it's not redered (the component object is not present in the object tree) and cannot be updated using <p:ajax update="someId"/> or <f:ajax render="someId"/>. What you need to do is wrap these two panels in an outer panel and update that one. Something like this:
<p:ajax process="#this" update="outerPanel"/>
...
<p:outputPanel id="outerPanel">
<p:outputPanel id="panel1" rendered="#{denemeView.str=='1'}">
<h:outputText value="Output: * " />
<p:inputText id="out" value="#{denemeView.islem}" />
</p:outputPanel>
<p:outputPanel id="panel2" rendered="#{denemeView.str=='2'}">
<h:outputText value="True choice! " />
</p:outputPanel>
</p:outputPanel>
See here for a similar problem.

Related

Primefaces 5: selectOneMenu isn't making listener calls after being updated

Code worked in a older version of Primefaces, but is failing in Primefaces 5.0. It's supposed to let a user pick an item in the first selectOneMenu (Group), which populates the second selectOneMenu (that part works). When the user selects an item from the second selectOneMenu, it's supposed to pull the matching code and update the Code, which isn't working. I can see that the listener in the Sub Group selectOneMenu isn't being called.
What am I doing wrong?
<h:outputLabel for="group" value="Group: *" />
<p:selectOneMenu id="group" label="Group" value="#{codeViewController.model.group}" style="width:100%">
<f:selectItems value="#{Session.groups}" />
<p:ajax event="change" listener="#{codeViewController.fetchSubGroup}" update="subGroup"/>
</p:selectOneMenu>
<p:message for="group" />
<h:outputLabel for="subGroup" value="Sub Group: *" />
<p:selectOneMenu id="subGroup" label="Sub Group" value="#{codeViewController.model.subGroup}" style="width:100%">
<f:selectItems value="#{codeViewController.model.subGroups}" />
<p:ajax event="change" listener="#{codeViewController.fetchCode}" update="code"/>
</p:selectOneMenu>
<p:message for="subGroup" />
<h:outputLabel for="code" value="Code: *" />
<p:inputText id="code" value="#{codeViewController.model.group.id.code}" label="Code">
<f:validateLength minimum="5" />
</p:inputText>
<p:message for="code" />

How disable sourceCaption from primefaces picklist

Does anyone knows how to disable the sourceCaption from primefaces picklist template?
I need that my user set three informations
(crudMB.upf.dataImplantacao, crudMB.upf.responsavelImplantacao, crudMB.upf.prazoSenha ) before selecting any options at the picklist.
At my code you guys can see this three variables that i need to enable the source part of the picklist.
<p:panel header="Produtos Fornecidos" style="height: auto;">
<h:panelGrid columns="2">
<h:outputLabel value="Data Implantação:" />
<p:calendar value="#{crudMB.upf.dataImplantacao}" />
<h:outputLabel value="Responsavel Implantação: " />
<p:inputText value="#{crudMB.upf.responsavelImplantacao}" />
<h:outputLabel value="Prazo de Senha: " />
<p:selectOneMenu value="#{crudMB.upf.prazoSenha}" >
<f:selectItem itemLabel="Selecione Um" itemValue="" itemDisabled="true" />
<f:selectItems value="#{crudMB.prazosSenha}" var="ps" itemLabel="#{ps.descricao}" />
</p:selectOneMenu>
</h:panelGrid>
<h:panelGrid>
<p:pickList id="picklist" value="#{crudMB.produtosFornecidos}" var="pf" itemValue="#{pf}" itemLabel="#{pf.nome}" converter="genericPickListConverter" >
<f:facet name="sourceCaption" >Disponiveis</f:facet>
<f:facet name="targetCaption" >Escolhidos</f:facet>
<p:ajax event="transfer" listener="#{crudMB.onTransfer}" />
<p:column>
<p:outputLabel value="#{pf.nome}"/>
</p:column>
<p:column>
<p:outputLabel value="#{pf.plataforma}"/>
</p:column>
<p:column>
<p:outputLabel value="#{pf.versaoAtual}"/>
</p:column>
</p:pickList>
</h:panelGrid>

JSF2 - selectOneMenu opens outside overlayPanel

I'm working with a <p:overlayPanel> that includes a couple of <p:selectOneMenu>s, as well as several other components. When the <p:selectOneMenu>s are opened, some of the fields fall outside of the <p:overlayPanel>, and clicking on them causes the panel to close. (See image below).
.
.
.
One solution would be to modify the <p:overlayPanel> as follows:
dismissable="false"
showCloseIcon="true"
Another would be to modify the <p:selectOneMenu>:
height="50"
I'm looking for some options for solutions that are as simple as possible and preferably don't involve a change to the UI (the above solutions both change the UI). Is there a way to keep the <p:overlayPanel> open when a click outside of it falls within one of its <p:selectMenu>s?
More Complete Code
<p:overlayPanel styleClass="col-settings-panel"
id="colSettingsPanel"
for="columnSettingsBtn"
hideEffect="fade"
widgetVar="wvcolSettingsPanel"
rendered="#{empty rendered ? 'true' : rendered}" >
<p:pickList id="pickList"
value="#{fileSearchPersonalizationBean.columns}"
var="column"
showSourceFilter="true"
itemLabel="#{column}"
itemValue="#{column}"
itemDisabled="#{column eq 'Ref No'}">
<p:ajax event="transfer" listener="#{fileSearchPersonalizationBean.onTransfer}" update="pickList availableCount selectedCount selectSortBy" />
<f:facet name="sourceCaption">
<h:outputText value="Available Columns ("/>
<h:outputText id="availableCount" value="#{fileSearchPersonalizationBean.sourceCount}"/>
<h:outputText value=")"/>
</f:facet>
<f:facet name="targetCaption">
<h:outputText value="Selected Columns ("/>
<h:outputText id="selectedCount" value="#{fileSearchPersonalizationBean.targetCount}"/>
<h:outputText value=")"/>
</f:facet>
</p:pickList>
<p:panelGrid columns="1">
<p:outputPanel styleClass="col-settings-panel-option">
<h:outputLabel value="Sort By: " />
<p:selectOneMenu id="selectSortBy"
value="#{fileSearchPersonalizationBean.sortBy}" >
<p:ajax listener="#{fileSearchPersonalizationBean.sortByChanged}" />
<f:selectItems id="sortByList" value="#{fileSearchPersonalizationBean.columns.target}" />
</p:selectOneMenu>
</p:outputPanel>
<p:outputPanel styleClass="col-settings-panel-option">
<h:outputLabel value="Items per Page:"/>
<p:selectOneMenu id="selectRows" value="#{fileSearchPersonalizationBean.sRows}" >
<f:selectItem itemLabel="10" itemValue="10" />
<f:selectItem itemLabel="25" itemValue="25" />
<f:selectItem itemLabel="50" itemValue="50" />
<f:selectItem itemLabel="100" itemValue="100" />
</p:selectOneMenu>
</p:outputPanel>
</p:panelGrid>
<p:panelGrid styleClass="toolbar" columns="2">
<p:outputPanel>
<p:commandButton styleClass="btn-secondary"
id="loadDefaults"
value="Reset Defaults"
update="selectSortBy pickList selectRows"
actionListener="#{fileSearchPersonalizationBean.loadDefaultVO}" />
</p:outputPanel>
<p:outputPanel styleClass="toolbar-right">
<p:commandButton styleClass="btn-secondary"
id="columnClose"
value="Cancel"
actionListener="#{fileSearchPersonalizationBean.panelCancel}"
immediate="false">
<f:attribute name="panelId" value="#{formId}:colSettingsPanel" />
</p:commandButton>
<p:commandButton styleClass="btn-primary"
id="columnSubmit"
value="Save & Apply"
actionListener="#{fileSearchPersonalizationBean.panelSave}"
oncomplete="refreshSearchResults();" >
<f:attribute name="panelId" value="#{formId}:colSettingsPanel" />
</p:commandButton>
</p:outputPanel>
</p:panelGrid>
</p:overlayPanel>`

Primefaces selectonemenu requiredmessage

I am creating a selectonemenu using Primefaces and JSF.
I want to appear a message saying "Choose one of the options". How can I do that?
This is the code:
<!--Gender-->
<p:selectOneMenu id="gender" value="#{users.gender}" required="true"
requiredMessage="Choose one of the options">
<f:selectItem itemLabel="Choose gender" itemValue="#{null}" />
<f:selectItem itemLabel="Male" itemValue="Male" />
<f:selectItem itemLabel="Female" itemValue="Female" />
</p:selectOneMenu>
Thanks
adding below on the submit button will work fine as well.
ajax="false"
*********************edited**********
As you requested, please find below block of codes that works fine for me ::
<h:form>
<p:panelGrid style="margin-top:5px;width:730px;">
<f:facet name="header">
<p:row >
<p:column colspan="20">Select Company</p:column>
</p:row>
</f:facet>
<p:row>
<p:column>
<p:selectOneMenu id="companyMenu" value="#{clientList.clientCode}"
style="width:550px;margin:5px;text-color:black" required="true"
requiredMessage="Please select a company !">
<f:selectItem itemLabel="Select a Company" noSelectionOption="true"
itemValue="#{null}" />
<f:selectItems value="#{clientList.clients.entrySet()}" var="entry"
itemValue="#{entry.key}" itemLabel="#{entry.value}" >
</f:selectItems>
</p:selectOneMenu>
</p:column>
<p:column>
<p:commandButton value="Submit" style="margin:5px;" action="#
{viewPayment.companyDetails(clientList.clientCode)}" ajax="false"/>
</p:column>
</p:row>
</p:panelGrid>
</h:form>
You can use :
if (users.getGender()==null) {
FacesContext.getCurrentInstance().addMessage(
null,
new FacesMessage(FacesMessage.SEVERITY_ERROR,
"Choose one of the options",
"Choose one of the options"));
}
SOLVED.I forgot to add the line <p:message for="gender" /> to the code. Thanks.

PrimeFaces dialogue showing the wrong information

I have a page with 2 dropdown lists that fill a data-table (depending on the choice made in the dropdown lists). The data table contains check-boxes for selecting multiple lines and then opening a dialogue that shows information based on the selected lines. the problem is: the first time I click on the button to open the dialogue it's empty, when I change the content of the dropdown lists and open the dialogue it will show the information of the previous selection not the one i just made and it'll stay that way until i change the dropdown list and so on... the dialogue always shows the information of the previous selection before changing the choice made in the dropdown list.
the page:
<h:form id="form">
<f:view>
<p:growl id="msgs" showDetail="true" />
<p:layout style="min-width:300px;min-height:200px;" id="layout">
<p:layoutUnit position="west" resizable="true" size="200" minSize="40" maxSize="300">
<!-- _______________________________________start drop down________________________________________________________ -->
<h:panelGrid columns="1" cellpadding="5">
<p:selectOneMenu id="Item" value="#{ThemeBean.idItem}">
<f:selectItem itemLabel="Select un Item " itemValue="" />
<f:selectItems value="#{ItemBean.listItemsUser}" var="utilisateur" />
<p:ajax listener="#{ThemeBean.handleCityChange}" update="suburbs" />
</p:selectOneMenu>
<p:selectOneMenu id="suburbs" value="#{ReponseBean.idTheme}">
<f:selectItem itemLabel="Select un Theme" itemValue="" />
<f:selectItems value="#{ThemeBean.suburbs}" />
<p:ajax listener="#{ReponseBean.handleCityChange_Ecart}" update=":form:dropArea" />
</p:selectOneMenu>
</h:panelGrid>
<p:separator />
</p:layoutUnit>
<!-- _______________________________________end drop down________________________________________________________ -->
<p:layoutUnit position="center">
<p:outputPanel id="dropArea">
<p:dataTable id="dt1" var="car"
value="#{ReponseBean.listPartheme_ecart}"
rendered="#{not empty ReponseBean.listPartheme_ecart}"
rowKey="#{car.id}" editable="true"
selection="#{EcartBean.selectedCars}">
<p:column selectionMode="multiple" style="width:18px" />
<p:column headerText="Questions">
<h:outputText value="#{car.q1.text}" />
</p:column>
<p:column headerText="Reponse">
<h:outputText value="#{car.rep}" />
</p:column>
<f:facet name="footer">
<p:commandButton id="multiViewButton" value="Ajouter Ecart" icon="ui-icon-search"
update=":form:multiDialog :form:displayMulti" oncomplete="multiCarDialog.show()"/>
</f:facet>
</p:dataTable>
<!-- ________________________________________dialogue________________________________________________ -->
<p:dialog id="multiDialog" header="Ajout Ecart" widgetVar="multiCarDialog" height="300" showEffect="fade">
<p:dataList id="displayMulti" value="#{EcartBean.selectedCars}" var="selectedCare">
#{selectedCare.q1.text} (#{selectedCare.rep})
</p:dataList>
<p:messages />
<h:panelGrid columns="3" cellpadding="5">
<h:outputLabel value="Niveau Ecart" />
<p:selectOneMenu id="idUtilisateur" value="#{EcartBean.idNiveauAudit}">
<f:selectItems value="#{NiveauEcartBean.listNiveauSelect}" var="nivecart" />
</p:selectOneMenu>
<p:message for="idUtilisateur" />
<h:outputLabel value="Constatation" id="Constatation" />
<h:inputText value="#{EcartBean.consta}" />
<p:message for="Constatation" />
<p:commandButton icon="ui-icon-disk" value="Ajouter" id="ViewButton" action="#{EcartBean.save}"
oncomplete="multiCarDialog.hide();">
</p:commandButton>
</h:panelGrid>
</p:dialog>
</p:outputPanel>
</p:layoutUnit>
</p:layout>
</f:view>
</h:form>
the methode ThemeBean.handleCityChange :
public void handleCityChange() {
qu = respQue.lister_Ques(idItem);
if (qu != null) {
List<SelectItem> listuti = new ArrayList<SelectItem>();
List<Theme> list = resp.lister_Par_Thme(qu.getId());
for (Theme p : list) {
listuti.add(new SelectItem(p.getId(), p.getLibelle()));
}
this.setSuburbs(listuti);
} else {
System.out.println("erreur");
}
}
ReponseBean.handleCityChange_Ecart :
public void handleCityChange_Ecart() {
listPartheme_ecart= new ArrayList<Reponse>();
System.out.println("taiile avant "+listPartheme_ecart.size());
List<Reponse> lr = respQ.findByTheme_ecart(idTheme);
System.out.println(idTheme);
for (int i = 0; i < lr.size(); i++) {
if (lr.get(i).getAudit().getId() == aud.getId())
listPartheme_ecart.add(lr.get(i));
}
}
I should mention that in the console i see the write information when i open the dialogue, it just doesn't show write away on the dialogue.
thank you for your time and help.
I am updating this post to say that i finaly solved the probleme of filling the popup
i put the dialogue in a new form like this:
</h:form>
<!-- ________________________________________dialogue________________________________________________ -->
<h:form id="hh" >
<p:dialog id="multiDialog" header="Ajout Ecart" widgetVar="multiCarDialog" height="300" showEffect="fade">
<p:dataList id="displayMulti" value="#{EcartBean.selectedCars}" var="selectedCare">
#{selectedCare.q1.text} (#{selectedCare.rep})
</p:dataList>
<p:messages />
<h:panelGrid columns="3" cellpadding="5">
<h:outputLabel value="Niveau Ecart" />
<p:selectOneMenu id="idUtilisateur" value="#{EcartBean.idNiveauAudit}">
<f:selectItems value="#{NiveauEcartBean.listNiveauSelect}" var="nivecart" />
</p:selectOneMenu>
<p:message for="idUtilisateur" />
<h:outputLabel value="Constatation" id="Constatation" />
<h:inputText value="#{EcartBean.consta}" />
<p:message for="Constatation" />
<p:commandButton icon="ui-icon-disk" value="Ajouter" action="#{EcartBean.save}" id="ViewButton" oncomplete="multiCarDialog.hide();" />
</h:panelGrid>
</p:dialog>
</h:form>
i have now one little probleme: the commandButton in the dialogue does not fire the methode save i have tried
<p:commandButton icon="ui-icon-disk" value="Ajouter" action="#{EcartBean.save}" id="ViewButton" oncomplete="multiCarDialog.hide();" />
and
<p:commandButton icon="ui-icon-disk" value="Ajouter" actionListener="#{EcartBean.save}" id="ViewButton" oncomplete="multiCarDialog.hide();" />
and
<p:commandButton icon="ui-icon-disk" value="Ajouter" id="ViewButton" oncomplete="multiCarDialog.hide();" >
<f:actionListener binding="#{EcartBean.save}"/>
</p:commandButton>
but nothing :( . where have gone wrong?
As per the documentation of <p:ajax>, listener is triggered only on partial request which I don't see happening in the code that you pasted. Use event="valueChange" to trigger a partial request which would result the current update to be shown in dialog.
<p:ajax event="valueChange" listener="#{ThemeBean.handleCityChange}" update="suburbs" />
<p:ajax event="valueChange" listener="#{ReponseBean.handleCityChange_Ecart}" update=":form:dropArea" />

Resources