p:selectOneMenu field with onChange not refreshing outputText - jsf

I have searched in google and Stack Overflow, and have come to this to try and get it to work however it still doesn't work.
Xhtml:
<p:panel id="testRefresh" header="Basic">
    <h:outputText value="#{sBean.headTest}" />
</p:panel>
<p:selectOneMenu  valueChangeListener="#{sBean.handleChange}">
    <f:selectItem itemLabel="" itemValue="#{null}" />
    <f:selectItem itemLabel="Cream Latte" itemValue="Cream Latte" />
    <f:selectItem itemLabel="Extreme Mocha" itemValue="Extreme Mocha" />
    <f:selectItem itemLabel="Buena Vista" itemValue="Buena Vista" />
    <p:ajax event="change" update=":testRefresh" process="#this" />
</p:selectOneMenu>
sBean.java
private String headTest;
//Getter and Setter for headTest and initialized in #PostSconstruct method
public void handleChange(ValueChangeEvent event) throws InterruptedException {
  headTest = (String) event.getNewValue();
}
Also do you know any editor online to test JSF with xhtml and respective bean? Would be easier to test.
Thanks for help.

In your *.xhtml I added <h:form></h:form> and slightly changed your update statement:
<h:form>
<p:panel id="testRefresh" header="Basic">
<h:outputText value="#{sBean.headTest}"/>
</p:panel>
<p:selectOneMenu valueChangeListener="#{sBean.handleChange}">
<f:selectItem itemLabel="" itemValue="#{null}"/>
<f:selectItem itemLabel="Cream Latte" itemValue="Cream Latte"/>
<f:selectItem itemLabel="Extreme Mocha" itemValue="Extreme Mocha"/>
<f:selectItem itemLabel="Buena Vista" itemValue="Buena Vista"/>
<p:ajax event="change" update="testRefresh"/>
</p:selectOneMenu>
</h:form>
Also do you know any editor online to test JSF with xhtml and respective bean? Would be easier to test.
As far as I know there is no online tool, but you could create a "skeleton" Spring project and test there. A good start to that is the Spring Initializr.

The issue was the throws InterruptedException in the Bean method, messes xhtml access to it.

Related

How to use same binding for 2 different components or whats the proper method?

I have a selectonemenu that appears in 2 different dialogs on the same screen, I need that when one of them changes its value and then user opens the other dialog, the selectonemenu still has the selected value previously, and viceversa.
I tried doing same binding for both of them but I notice that one of them would dissapear, whats the proper way to achieve this?
this is the code of them by the way:
<p:selectOneMenu binding="#{homeView.somTipoPlato}"
id="somTipoPlato" style="width:100%">
<p:ajax event="change" listener="#{homeView.listerprueba}" />
<f:selectItem itemLabel="Tipo de Comida"></f:selectItem>
<f:selectItems value="#{homeView.losTipoPlatoSelectItem}" />
</p:selectOneMenu>
<p:selectOneMenu id="somTipoPlatoBuscarPlato"
binding="#{homeView.somTipoPlato}" style="width:100%">
<p:ajax event="change" listener="#{homeView.listerprueba}" />
<f:selectItem itemLabel="Tipo de Comida"></f:selectItem>
<f:selectItems value="#{homeView.losTipoPlatoSelectItem}" />
</p:selectOneMenu>
Any proper way or workaround?
Hey guys I just needed to use the value property of the selectonemenus, here is why:
After receiving some feedback in the comments and reading How does the 'binding' attribute work in JSF? When and how should it be used?
I noticed that using binding most of the times is a bad practice or a design smell, so in my case I didn't know it was a bad practice so I was using it just because I though it was a normal way to do the things, but it wasn't, so the proper solution for this would be using value instead of binding and that way I can achieve what I wanted, 2 selectonemenus with same value, like so:
<p:selectOneMenu value="#{homeView.selectedValue}"
id="somTipoPlato" style="width:100%">
<f:selectItem itemLabel="Tipo de Comida"></f:selectItem>
<f:selectItems value="#{homeView.losTipoPlatoSelectItem}" />
</p:selectOneMenu>
<p:selectOneMenu id="somTipoPlatoBuscarPlato"
value="#{homeView.selectedValue}" style="width:100%">
<f:selectItem itemLabel="Tipo de Comida"></f:selectItem>
<f:selectItems value="#{homeView.losTipoPlatoSelectItem}" />
</p:selectOneMenu>
notice that this way they are able to share the same value and there is also no need of ajax listeners, hope this helps somebody that comes across same situation.
In the link provided you will find all the reasons why using value is the correct approach

Different behaviour PF select one menu JSF selectOnemenu

I am experiencing a problem with the use of primefaces selectOneMenu. I am having a menu getting its selectItems values from a backing bean. The container of the menu is updated by ajax. Useing primefaces menu, all the items are lost after the update, using standard JSF Menu, all the items look fine.
XHTML:
<p:outputPanel id="myContainer" widgetVar="myContainerVar">
<p:outputPanel rendered="#{somePresenter.renderBox}">
<h:selectOneMenu id="mySelectMenu"
converter="omnifaces.SelectItemsConverter"
value="#{somePresenter.someObject}">
<f:selectItems value="#{somePresenter.someObjectList}"
var="item" itemValue="#{item}" itemLabel="#{item}" />
</h:selectOneMenu>
<p:selectOneMenu id="mySelectMenuP"
converter="omnifaces.SelectItemsConverter"
value="#{somePresenter.someObject}">
<f:selectItems value="#{somePresenter.someObjectList}"
var="item" itemValue="#{item}" itemLabel="#{item}" />
</p:selectOneMenu>
</p:outputPanel>
</p:outputPanel>
<p:commandLink action="#{somePresenter.doIt()}" update="myContainer"
value="doIt!" />
Bean:
#Getter
#Setter
private SomeObject someObject;
#Getter
#Setter
private Boolean renderBox = true;
public List<SomeObject> getObjectList(){
return objectBoundary.getList();
}
public void doIt(){ this.renderBox = !this.renderBox; }
When the page is first displayed, both menus are filled with Items. However, as soon as I close and open the container (press command link twice), the h:selectOneMenu still looks fine while the p:selectOneMenu has lost all its Items.
I have taken a closer look using googles developer tools, both menus have the items as options. The p-menu just seems not to be correctly rendered.
I am experiencing exactly the same Problem when using Enums instead of the shown Objects. The presenter is #Named and #ViewScoped.
I would really appreciate any help since I am stucked with this for quite some time now. Thank you in advance!
--- edit ---
I am using Primefaces version 4.0 and JSF version 2.2
--- edit ---
Upgrading to PF 5.3 makes the menu look slightly different:
Slightly different menu after upgrade to PF 5.3

primefaces JSF p:selectOneMenu submitting null value

after researching for a while I still cannot find what I'm doing wrong.
I'm using Primefaces 3.5 with Seam. I have a selectOneMenu that is submitting a null value to the method manualServiceRequestController.setService(Service service).
This is the .xhtml code:
<p:selectOneMenu id="service" value="#{manualServiceRequestController.service}">
<f:converter converterId="serviceConverter" />
<f:selectItems value="#{manualServiceRequestController.allServices}" />
<p:ajax render="parameterPanel" event="change" process="#parent" partialSubmit="true" />
</p:selectOneMenu>
Thanks!
The problem was the attribute partialSubmit="true". I removed it and now the correct value is sent. I still don't understand exactly why.
Thanks skuntsel and Xtreme Biker for your responses.
Regards!

p:watermark clears on updating Component even if there is no value

I'm using Primefaces p:watermark on a p:inputText. Its working fine.
When ever I update the component its loosing watermark,even when there is no content inside the p:inputText
<h:form id="reg_frm">
<p:inputText id="name" value="#{user.name}"/>
<p:watermark value="your name" for="name" id="name_watermark" />
<p:selectOneMenu value="#{user.drpvalue}">
<f:selectItem itemLabel="One" itemValue="1"/>
<f:selectItem itemLabel="two" itemValue="2"/>
<f:selectItem itemLabel="three" itemValue="3"/>
<f:selectItem itemLabel="four" itemValue="4"/>
<p:ajax event="change" update="name name_watermark"/>
</p:selectOneMenu>
</h:form>
How do I retain the Watermark when there is no content in the
p:inputText after update?
Note: Primefaces version - 3.5
According to the PrimeFaces showcase for watermarks: "Watermark displays a hint about input fields by using native placeholder in supported browsers and a javascript solution in others browser compatibility."
PrimeFaces probably adds some hidden javascript stuff to the element which is a parent of both components (input and watermark). In your case that's the form which you would need to update. If you don't want that, put a new panelgroup around both elements and update that, which will have the same effect.
Try this attribute:
oncomplete="PrimeFaces.showWatermarks()"
It was given in Primefaces User's Guide.

JSF SelectOneMenu Browser Back Button

I have a problem where I am using a SelectOneMenu for navigation:
<p:selectOneMenu value="#{navigator.outcome}">
<f:selectItem itemLabel="Select item.." />
<f:selectItems value="#{navigator.menuItems}" />
<p:ajax event="change" listener="#{navigator.navigate}" />
</p:selectOneMenu>
This works fine except when I navigate back it doesnt display "Select Item.."
The navigator bean is request scoped (I've tried view scoped as well).
I've disabled caching using a WebFilter.
You need to turn autocomplete off at the form level.
With JSF 2.1 you cannot do this.
Either wait until JSF 2.2 or uses omnifaces:
See link:
how to do autocomplete="off" at form level in JSF

Resources