This is the code:
<h:form id="articleForm" >
<p:commandButton value="Select tags" ajax="true" >
<f:ajax execute="#form" render="#form :articleForm:tags" />
</p:commandButton>
<p:pickList id="tags" value="#{articleController.dualListModelForTags}" var="tag" itemLabel="#{tag.tag}" itemValue="#{tag}" converter="distinctTagConverter">
<f:facet name="sourceCaption">Distinct tags</f:facet>
<f:facet name="targetCaption">Connected tags</f:facet>
</p:pickList>
</h:form>
When the commandbutton is clicked, the getDualListModelForTags() in the backing bean is called and executed. In getDualListModelForTags() I make some modifications so I want the picklist to be updated. But the picklist(id=tags) is not rendered again. Only when I refresh the page, are the modifications made to the picklist.
The PrimeFaces <p:commandButton> component doesn't work together with <f:ajax>. You need to use the button's own ajax-targeted attributes instead. Instead of the <f:ajax execute> you should use <p:commandButton process>. But this already defaults to #form, so you can omit it. Instead of the <f:ajax render> you should use <p:commandButton update>. Specifying client IDs which are already covered by #form is unnecessary, so just #form is sufficient. Also the ajax="true" attribute is unnecessary as that's the default already.
So just this should do:
<p:commandButton value="Select tags" update="#form" />
Unrelated to the concrete problem, you're doing the business job inside a getter method. This is a bad idea. Do it in the button's action method instead. You also seem to be using a session scoped bean for view scoped data. This is a bad idea. Put the bean in the view scope instead.
Related
I have a page with a h:selectOneMenu, and I want to hide a dataTable when I choose a new value on the h:selectOneMenu while some bean attribute values update. I'm trying diferent things, and I'm able to hide the dataTable by reloading the page. I have tried this using some JavaScript code, on onsomething attributes. In that case, those bean attribute values disapear although I use t:saveState (and I also need the view scope for the bean).
Here is a little example to clarify this:
<h:selectOneMenu id="list" value="#{Bean.id}">
<f:selectItems value="#{Bean.List}" var="element" itemLabel="#{element.name}" itemValue="#{element.id}"/>
<t:saveState value="#{Bean.id}"/>
<f:ajax listener="#{Bean.populateBean}" render=":form:period" event="change"/>
</h:selectOneMenu>
<h:selectOneMenu id="period" value="#{Bean.period}">
<f:selectItems value="#{Bean.listaPeriod}" var="period" itemLabel="#{period[1]}" itemValue="#{period[0]}"/>
<t:saveState value="#{Bean.period}"/>
</h:selectOneMenu>
<h:commandButton id="search" action="#{Bean.doSearch}"></h:commandButton>
<t:dataTable id="data" value="#{Bean.configList}" rendered="#{Bean.search}"
<t:column>
...
</t:dataTable>
And Bean.doSearch changes Bean.search to true. How can I hide the dataTable when I choose a new value on h:selectOneMenu id="list"?
EDIT:
In short, the search button renders the table, and I would want to hide that table when I just choose a new value on the "list" dropdown without reloading the page. Now, the <f:ajax> is used only to rerender the "period" dropdown value.
Thanks in advance!
Your question is hardly understandable, but if you want to kick the datatable out of your view on ajax request triggered by your dropdown, you need to enclose it in a component that's always present in the view so that HSF would know what to rerender when ajax call successfully finishes:
<h:panelGroup id="rerender">
<t:dataTable rendered="#{bean.condition}" ...>
....
</t:dataTable>
<h:panelGroup>
Of course, to get it working you should specify id of the component to be rerendered:
<h:selectOneMenu ...>
...
<f:ajax listener="#{bean.populate}" render="rerender" />
</h:selectOneMenu>
Note that if both dropdown and datatable components belong to the same form, it's not necessary to specify absolute id of the latter's parent. Also note that specifying event is redundant, as it already defaults to the right one. Finally, as you're on JSF 2.x, using save state is not necessary, just bind the values of your form data to a view scoped bean.
The last thing to note is the fact that you fail to conform to the Java Naming Conventions, the thing you should correct as soon as possible.
I am trying to ajax-refresh the main-content from navigation menu.
The requirement is exactly the same in the link
How to ajax-refresh dynamic include content by navigation menu? (JSF SPA)
following the pattern answered by BalusC,
<h:panelGroup id="content" layout="block">
<h:form id="contentform">
<h:panelGroup rendered="#{bean.page == 'include1'}">
<ui:include src="include1.xhtml" />
</h:panelGroup>
<h:panelGroup rendered="#{bean.page == 'include2'}">
<ui:include src="include2.xhtml" />
</h:panelGroup>
<h:panelGroup rendered="#{bean.page == 'include3'}">
<ui:include src="include3.xhtml" />
</h:panelGroup>
</h:form>
Each xhtml has its own managed bean with #PostConstruct method, the problem is all the #PostConstruct method gets called irrespective of rendered condition.
<ui:include/> is a taghandler while <h:panelGroup/> is a render-time tag. The difference is that they're both active at different times during the lifecycle of the build. In this particular case, <ui:include/> is active and processed before the <h:panelGroup/>. So while your render condition might hide the dynamic include at render time, the include would still go thru the grinder anyway, resulting in the processed managed beans.
You should place the rendered attribute on the <ui:include/> instead. Be sure that the render condition is not also dependent on some other render time construct
Trying to build a simple JSF application. One i don't get is, what mechanism is to use to trigger page reload. I have tried following
<h:selectOneMenu
id="ChallengesListBox"
onchange="submit()"
valueChangeListener="#{bean.projectselected}">
<f:selectItems value="#{bean.projectnames}"/>
</h:selectOneMenu>
<h:commandButton value="submit" action="#{bean.submit}" />
with
public String submit() {
this.description.setRendered(true);
return null;
}
But this has no effect. The bean method
public String submit()
remains untouched, as I can see in debug mode.
This is not related to navigation. There are many causes why a bean action method is not invoked. You can find them all in this answer: commandButton/commandLink/ajax action/listener method not invoked or input value not updated
I suspest that you've either simply no <h:form>, or that you have multiple buttons in the form (the first one would then be invoked on submit()), or that the button is by itself not rendered during processing of the form submit.
Unrelated to the concrete problem, this JSF 1.x style approach is very clumsy. As you're apparently already on JSF 2.x, I suggest the following much simpler approach:
<h:selectOneMenu value="#{bean.projectname}">
<f:selectItems value="#{bean.projectnames}" />
<f:ajax render="somepanel" />
</h:selectOneMenu>
<h:panelGroup id="somepanel">
<h:outputText value="#{bean.description}" rendered="#{not empty bean.projectname}" />
</h:panelGroup>
(this will render the #{bean.description} value whenever the #{bean.projectname} is not null/empty according to the selection of the drop down list)
And make sure that you remove all binding attributes to the backing bean. Also make sure that the bean is #ViewScoped whenever you have input/button components inside the <h:panelGroup id="somepanel">.
I have a base class, which is normal Java class. Three subclasses extend it which are #ViewScoped beans. There's a facelet using a dynamic variable. I have three xhtml pages which use this facelets with the three beans viz. bean1, bean2 and bean3 which are dynamically included in a rich:tab component on a main page.
So far so good. But on every page there are a few popups which should refer to the current bean. And since those popups need form tag inside them, I have included them outside the main page's form tags in order to avoid nested form tags. Now I want the popup to refer to current bean (bean1, bean2 or bean3, depending upon from where the popup is called) in question. How do I achieve this?
Try something like this:
Add a new bean (popupBean) that will contain reference to current bean in popup.
Add an action that will set needed bean as property of popupBean. Example:
<h:commandLink>
<a4j:ajax render="myPopup"/>
<f:setPropertyActionListener target="#{popupBean.currentBean}" value="#{bean1}"/>
<h:outputText value="Click ME!"/>
</h:commandLink>
Use show attribute of rich:popupPanel to show the popup:
<rich:popupPanel id="myPopup" modal="true" width="600" moveable="true"
show="#{not empty popupBean.currentBean}" onmaskclick="#{rich:component('myPopup')}.hide();" autosized="true">
<f:facet name="header"><h:outputText value="Cool popup!"/></f:facet>
<h:panelGrid style="margin: 0">
<h:panelGroup style="max-height: 400px;overflow-y: auto;" layout="block">
<h:outputText value="#{popupBean.currentBean.myBeanProperty}"/>
</h:panelGroup>
<h:button value="Close" onclick="#{rich:component('myPopup')}.hide();return false;"/>
</h:panelGrid>
</rich:popupPanel>
I have a login page in a web application project:
<h:form>
<h:messages />
<h:inputText label="Username" value="#{login.username}" required="true" />
<h:inputSecret label="Password" value="#{login.pass}" required="true" />
<h:commandButton value="Accedi" action="#{login.check()}" />
</h:form>
When I submit the form, jsf creates three instances of Login class (I've noticed this behavior using debugger). In this way I can't use the username and password in Login.check() method: they are both null.
Besides I've tested another more complex project I've created some time ago and it works fine: only one instance is created. I don't understand where I'm wrong.
Take a look at the managed bean configuration of the login bean (either annotations of the class or in faces-config.xml), specifically its scope. A scope of "none" would have exactly the effect you're observing. The appropriate scope would probably be "request".