Lazy loading f:selectItems when opening p:selectOneMenu - jsf

I would like to load list of <f:selectItems> only when user opens <p:selectOneMenu>.
I tried this way but doesn't work:
<p:selectOneMenu id="bases" value="#{sucesoBB.suceso.base}" converter="EntitiesCachedConverter" >
<f:selectItem itemLabel="" itemValue="" />
<f:selectItems value="#{sucesoBB.bases}" var="base" itemValue="#{base}" itemLabel="#{base.id} - #{base.descripcion}" />
<p:ajax event="click" onstart="#{sucesoBB.bases == null or sucesoBB.bases.size() ==1 or sucesoBB.bases.empty()?'cargaBases();':''}" />
</p:selectOneMenu>
<p:remoteCommand name="cargaBases" update="bases" actionListener="#{sucesoBB.cargaBases}" />
How can I achieve this?

A "dynamic" attribute was recently added to the selectOneMenu component.
Just add it like this: <p:selectOneMenu dynamic="true" ... >
https://github.com/primefaces/primefaces/issues/2399
Demo:
https://www.primefaces.org/showcase/ui/input/oneMenu.xhtml
You need to have at least Primefaces version 6.0.20, 6.1.2 or 6.2

Related

Update Component Even If SelectOneMenu Value Is Required

I have a required select and my problem is that when the user selects an empty option (null) the validation jumps in and the listener call of the select is being skipped. Some components on my view are depending on this value so in case of null being selected the bean won't get actualized and the components don't change.
Example:
<h:form id="createForm">
<p:selectOneMenu id="produktCreateTypSelect"
converter="omnifaces.SelectItemsIndexConverter"
value="#{productController.selectedProduct.typ}" required="true">
<f:selectItem itemValue="#{null}" itemLabel="-- Select --" />
<f:selectItems var="productType" value="#{productController.findAllProducts()}"
itemLabel="#{productType.name}" itemValue="#{productType}" />
<p:ajax process="#this " event="valueChange" update="createForm"
listener="#{productController.printHelloWorld}" />
</p:selectOneMenu>
<h:panelGroup id="dummy1" rendered="#{productController.selectedProduct.type != null}" />
</h:form>
The question is what the best way is to update that panelGroup
'dummy1'
Thanks for any help.

p:SelectOneMenu default value in edit mode

I'm using primefaces and have a datatable that has 2 columns. One column is outputtext another one is selectOneMenu. I made editable selectOneMenu. Actually it's work but not properly. Default value of selectItem is shown null but ı want it to show first value as default value. How can I make it?
<p:dataTable id="cellEditingTable" var="message"
value="#{messageTableController.menuList}" paginator="true"
paginatorPosition="bottom" editable="true" editMode="cell">
<p:column>
<p:selectOneMenu id="menu" value="#{messageTableController.selected}"
style="width:96%" effect="fold" editable="true">
<f:selectItem itemLabel="#{message.assign}"
itemValue="#{message.assign}" />
<f:selectItem itemLabel="#{message.combo}"
itemValue="#{message.combo}" />
</p:selectOneMenu>
</p:column>
</p:dataTable>
I change selectOneMenu's value to first ItemValue. So when run the program, first ItemValue picked selected item as a default.
<p:selectOneMenu id="menu" value="#{message.assign}"
style="width:97%" editable="true">
<f:selectItem itemLabel="#{message.assign}"
itemValue="#{message.assign}" />
<f:selectItem itemLabel="#{message.combo}"
itemValue="#{message.combo}" />
</p:selectOneMenu>
Add noSelectionOption to the first selectItem
<f:selectItem itemLabel="#{message.assign}"
itemValue="#{message.assign}" noSelectionOption="true" />
May be late to answer this.
If you use editable="true" then while rendering in the browse, it will render as textbox.
Remove the editable="true" then the default value will be selected.
If you want to provide the filter option in the selectOneMenu, use filter="true"
<p:selectOneMenu id="menu" value="#{message.assign}"
style="width:97%" filter="true">
<f:selectItem itemLabel="#{message.assign}"
itemValue="#{message.assign}" />
<f:selectItem itemLabel="#{message.combo}"
itemValue="#{message.combo}" />
</p:selectOneMenu>
Based on the editable property, it will render in browser as below.

p:selectOneMenu ajax change event not working

I have the following component on the xhtml:
<p:outputLabel for="concept" value="Concept" />
<p:selectOneMenu id="concept" value="#{dIGRCController.digrc.qconce}"
requiredMessage="Debe de seleccionar un concepto."
required="#{request.getParameter('validate')}">
<f:selectItem itemLabel="Concept" itemValue="" />
<f:selectItems value="#{cCRX1Controller.ccrx1.concepts.entrySet()}"
var="concepts" itemValue="#{concepts.key}"
itemLabel="#{concepts.value}" />
<p:ajax event="change" execute="#this" listener="#{dIGRCController.testing()}" />
</p:selectOneMenu>
The values are coming correctly from the cCRX1Controller class. However, when I select an option, I am trying to display the value. the #{dIGRCController.testing()} looks like this:
public void testing()
{
System.out.println("sdfsd");
}
What am I doing wrong? I checked this question but could't figure out what the problem is.
Try with this
<p:ajax process="#this" listener="#{dIGRCController.testing()}" />
I think the default of ajax event of Primefaces select one menu is valueChange event. So, try with using also
<p:ajax event="valueChange" process="#this" listener="#{dIGRCController.testing()}" />

change the variable JSF from SelectOneMenu

I have setted a JSF Varidable Like this:
<c:set var="selectedech" value="#{ManagedBean.selectedtypeFacturation}" scope="request"/>
After that i putted it on a SelectOneMenu:
<p:selectOneMenu panelStyle="width: 120px" effect="fade" id="typeFacture" value="#{selectedech}" >
<f:selectItem itemValue="Echeancier" itemLabel="Echeancier"/>
<f:selectItem itemValue="Mensuel" itemLabel="Mensuel"/>
<p:ajax event="change" update="#this"/>
</p:selectOneMenu>
I would like to change the value of JSF variable "selectedech" each time i change the selection.
Any idea in order to get it work well
Thx

show a panel in primefaces depending on a dropdownlist

I have a drop down list with several values and I want to show a panel only if a value has been selected
Here is the code simplified
<p:selectOneMenu id="" value="#{myBean.myElement}" >
<f:selectItem itemLabel="Choose an element itemValue="" />
<f:selectItems value="#{myBean.myElementList}" />
<p:ajax update="myPanel" listener="#{myBean.handleChange}"/>
</p:selectOneMenu>
<p:panel id="myPanel" header="My Header" style="margin-bottom:10px;" rendered="#{myBean.myElement != null}">
But this does not seem to work (it works only if I refresh manually the page).
How could you fix this ?
Since myPanel is not rendered, the component won't be in the component tree, so it cannot be updated later in the view. Use another UIContainer to wrap it like <h:panelGroup> and update this container:
<p:selectOneMenu id="" value="#{myBean.myElement}" >
<f:selectItem itemLabel="Choose an element itemValue="" />
<f:selectItems value="#{myBean.myElementList}" />
<!-- here update to foo instead of myPanel -->
<p:ajax update="foo" listener="#{myBean.handleChange}"/>
</p:selectOneMenu>
<h:panelGroup id="foo">
<p:panel id="myPanel" header="My Header" style="margin-bottom:10px;"
rendered="#{myBean.myElement != null}">
</h:panelGroup>

Resources