This question already has answers here:
commandButton/commandLink/ajax action/listener method not invoked or input value not set/updated
(12 answers)
Closed 3 years ago.
I have this dataTable:
<h:dataTable value="#{orderController.orderList}" var="order"
styleClass="table table-striped">
<h:column>
<f:facet name="header">#</f:facet>
<h:outputText value="#{order.orderNo}" escape="false"/>
</h:column>
<h:column>
<f:facet name="header">Cliente</f:facet>
<h:outputText value="#{order.client}" escape="false"/>
</h:column>
<h:column>
<f:facet name="header">Data</f:facet>
<h:outputText value="#{order.date}" escape="false"/>
</h:column>
<h:column>
<f:facet name="header">Status</f:facet>
<h:outputText value="#{order.status}" escape="false"/>
</h:column>
<h:column>
<f:facet name="header"></f:facet>
<h:form>
<h:commandButton action="#{orderController.orderDetail}" value="Detalhe" styleClass="btn btn-info"/>
</h:form>
</h:column>
</h:dataTable>
I'm showing a list of orders and each list has a button "Detail" that will redirect the user to the orderDetail.html page inside views/fornecedores.
I've debugged and when I click on the commandButton, it is not calling my bean function.[
I have also tried this: <h:commandButton action="views/fornecedores/orderDetail.html" value="Detalhe" styleClass="btn btn-info"/> and nothing, it keeps redirecting me to the same page, orderSearch.html.
What I need is to call the method that will receive a orderNo parameter and will load the object and redirect to the orderDetail.html page.
What am I doing wrong or what is the best way to this approach?
In this particular case, that can happen when you're nesting forms which is illegal in HTML. This can also happen when the #{orderController} is request scoped and the orderList content depends on a request based value which causes that the list is incompatibly changed when the form submit is to be processed.
So, make sure that you aren't nesting multiple <h:form> components in each other and make sure that the #{orderController} is a #ViewScoped bean and that you aren't manipulating the orderList in its getter method.
See also:
commandButton/commandLink/ajax action/listener method not invoked or input value not updated
As to your concrete functional requirement, the <h:link> with <f:param> and <f:viewParam> is a more sane approach for this. It's bookmarkable and more SEO friendly. See also Communication in JSF 2.0 - Processing GET request parameters.
Related
This question already has answers here:
How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"
(6 answers)
Closed 2 years ago.
When I click addTagButton, everything works well. It updates all three components: tags, tagId and addTagButton.
<p:commandButton id="addTagButton" icon="ui-icon-plus"
action="#{searchBean.addTag}"
update="tags, tagId, addTagButton"
disabled="#{searchBean.tagChoices.size() == 0}">
</p:commandButton>
Here's the table component:
<h:dataTable id="tags" var="tag" value="#{searchBean.tags}">
<h:column>
<div style="text-align:right;">
<h:outputLabel value="#{tag.typeName}:"/>
</div>
</h:column>
<h:column>
<p:inputText id="tag" size="25" value="#{tag.typeValue}"
disabled="#{searchBean.searchForParent}"/>
</h:column>
<h:column>
<p:commandButton id="delTagButton" icon="pi pi-trash"
action="#{searchBean.deleteTag}"
update=":contentForm:tagId, :contentForm:addTagButton, tags">
<f:setPropertyActionListener
target="#{searchBean.tagId}"
value="#{tag.typeName}" />
</p:commandButton>
</h:column>
</h:dataTable>
When i click on delTagButton that is on each row in tags table, action works fine, :contentForm:tagId and :contentForm:addTagButton update fine. But tags table which is where clicked command button exist, does not update.
When a row is deleted, change must reflect in the tags table which does not work.
Now, If I change h:dataTable to p:dataTable or any other primefaces component, it works. I am trying to make it work with h:dataTable.
Primefaces 8.0, JSF 2.5
Look on this simple example:
<h:form id="form">
<h:panelGroup id="wrapper" layout="block">
<h:dataTable id="table" border="1" value="#{testBean.list}" var="person">
<h:column>#{person.name}</h:column>
<h:column>#{person.surname}</h:column>
<h:column>
<p:commandButton id="delTagButton" icon="pi pi-trash"
action="#{testBean.remove(person)}" update="table">
</p:commandButton>
</h:column>
</h:dataTable>
</h:panelGroup>
</h:form>
To really find out what is being updated look in browser console.
If you're trying to update="table" nothing happens (like in your code). If you try to update a parent of the table (which is often a case), you will get an error an error:
SEVERE: Error Rendering View[/example.xhtml]
org.primefaces.expression.ComponentNotFoundException: Cannot find component for expression "wrapper" referenced from "form:table:0:delTagButton".
at org.primefaces.expression.SearchExpressionFacade.cannotFindComponent(SearchExpressionFacade.java:677)
So we could try with "older" parent and realize that update="#form" works! OK, so we want to help to find id="table\wrapper" component. Let try clientId update="form:table". Like with update="table" nothing happens. And no error from PF (so the element can be found). This could mean that h:dataTable cannot be properly re-rendered from inside itself (but I don't want to throw stones:-)). This is often a case with e.g. popups in JSF 3rd party component libraries.
In this particular example I'd say, you have to update form:wrapper (adding form: works) or just #form to get it work. With your code it would be the same. Try to update some table parent or the whole form.
All of above is tested in JSF 2.2, with last RF, an old PF and OmniFaces. But I think the same would be the case with newer versions.
BTW. I didn't know there is JSF 2.5 :-)
This question already has an answer here:
#SessionScoped bean looses scope and gets recreated all the time, fields become null
(1 answer)
Closed 7 years ago.
I have the following JSF page.
The "Manage Attendee" link is defined by the following XHTML:
<h:form>
<h:commandLink value="Manage Attendees" action="/Management/Event/manageAttendees?faces-redirect=true">
<f:setPropertyActionListener target="#{managerManager.currentEvent}" value="#{event}" />
</h:commandLink>
(...)
</h:form>
currentEvent is a field in the "ManagerManager" ManagedBean which is set upon the redirect and refers to the event in the description field. It has a list which we want to iterate through. However, the second page:
Does not render the attributes. Like the currentEvent list was empty, which the debug report says it's not.
The following is the code for the second page which should get the title:
<h2>Attendees in this Event</h2>
<h:dataTable
var="attendees"
summary="List of attendees in this event."
value="#{managerManager.currentEvent.attendees}"
rules="all"
cellpadding="5">
<h:column>
<f:facet name="header">
<h:outputText value="Name" />
</f:facet>
<h:outputText value="#{attendees.attendee.name}" />
</h:column>
</h:dataTable>
The ManagedBean is session scoped as well. It looks like the second page doesn't have access to currentEvent... why?
Turns out it as an import statement error.
The #SessionScoped annotation being used in the Managed Bean was from
import javax.enterprise.context.SessionScoped;
rather than
import javax.faces.bean.SessionScoped;
as it obviously should be. Which explains why only this specific page had this issue in my project.
<h:dataTable value="#{SearchingBeans.list}" var="entry">
<h:column>
<f:facet name="header">
<h:outputLabel>Photo</h:outputLabel>
</f:facet>
</h:column>
<h:column>
<f:facet name="header">
<h:outputLabel>Pseudo</h:outputLabel>
</f:facet>
<h:outputLabel value="#{entry.pseudo}"></h:outputLabel>
</h:column>
<h:column>
<f:facet name="header">
<h:outputLabel>Description</h:outputLabel>
</f:facet>
<h:outputLabel value="#{entry.description}"></h:outputLabel>
</h:column>
<h:column>
<f:facet name="header">
<h:outputLabel>Photo</h:outputLabel>
</f:facet>
<h:outputLabel value="#{entry.photo[0].path}"></h:outputLabel> <-- this a List
</h:column>
</h:dataTable>
i got a entities member one of his property is a List photo with get/set
that property is populate
i don't know how to fetch that value in jsf i want only the first picture for each member since their have 2-3 photos. Its that possible?? any other solution will be appreciate.
Just iterate over it using <ui:repeat> or <h:dataTable> the usual way. It's perfectly valid to nest multiple iterating components in each other. In case of <h:dataTable>, you only need to make sure that you put the nested iterating component inside a <h:column>.
E.g.
<h:dataTable value="#{bean.entities}" var="entity">
<h:column>
#{entity.property}
</h:column>
<h:column>
<ui:repeat value="#{entity.subentities}" var="subentity">
#{subentity.property}
</ui:repeat>
</h:column>
</h:dataTable>
or
<h:dataTable value="#{bean.entities}" var="entity">
<h:column>
#{entity.property}
</h:column>
<h:column>
<h:dataTable value="#{entity.subentities}" var="subentity">
<h:column>
#{subentity.property}
</h:column>
</h:dataTable>
</h:column>
</h:dataTable>
You'll potentially only run into issues when you nest multiple <ui:repeat> components and use <f:ajax> in it while using an older version of Mojarra.
Only JSTL <c:forEach> wouldn't work when nested inside a JSF iterating component for the reasons explained here JSTL in JSF2 Facelets... makes sense?
Unrelated to the concrete problem, please don't abuse <h:outputLabel> for pure text presentation. It generates a HTML <label> element which is intented to label an input element by for attribute. However, you're doing that nowhere in the code. You should be using <h:outputText> instead. By the way, I'm lately seeing this more often in code of starters. There must be somewhere a bad tutorial or resource which is abusing the <h:outputLabel> this way instead of <h:outputText> or even plain EL in template text. Which tutorial/resource was you using? Then I can contact the author about this severe misinstruction. See also Purpose of the h:outputLabel and its "for" attribute
This question already has an answer here:
Using <ui:repeat><h:inputText> on a List<String> doesn't update model values
(1 answer)
Closed 7 years ago.
I'm trying to display the data from a List contained in a bean via a datatable, and have actions performed by code as the user types. It initially displays ok, and changes to the List are reflected in UI.
My issue is that values entered into the inputText are ignored. Tried looking for solutions, I've tried checking the List as the values changed, and also tried to check without the ajax in case that was the issue (no change). Have tried using session and view scoped bean without luck. Tried wrapping the Strings in a POJO.
Going crazy here. Feel like I'm missing something obvious. Any idea?
<h:dataTable id="multioptionanswers"
value="#{multiTextBean.texts}" var="texts">
<h:column>
<f:facet name="header">
<h:outputText value="Enter Values"></h:outputText>
</f:facet>
<h:inputText value="#{texts}" immediate="true">
<f:ajax event="blur" execute=":addgroup"
render=":addgroup"
listener="#{multiTextBean.update}" />
</h:inputText>
</h:column>
</h:dataTable>
**addgroup is a panel group that the data table resides in.
Worked it out, needed change to how the inputtext read the data. Solution below in case it helps someone :
<h:dataTable id="multioptionanswers" binding="#{table}"
value="#{multiTextBean.texts}" var="texts">
<h:column>
<f:facet name="header">
<h:outputText value="Enter Values"></h:outputText>
</f:facet>
<h:inputText
value="#{multiTextBean.texts[table.rowIndex]}">
<f:ajax event="blur" execute=":addgroup" render=":addgroup"
listener="#{multiTextBean.update}" />
</h:inputText>
</h:column>
</h:dataTable>
I am trying to fetch the questions and the associated answers. I am able to get the questions fine but the nested datatable does not even recognize the properties each answer has, and this is also pointed out by the IDE as well. Maybe this is not the right way to go about this. How do I iterate over the answers associated with each question ?
<h:dataTable value="#{questionBacking.recentlyAskedQuestions}" var="questions"
rendered="#{questionBacking.recentlyAskedQuestions.size() > 0}"
border="1">
<h:column>
<h:outputText value="#{questions.questionTitle}" />
<br/>
<h:outputText value="#{questions.questionBody}" />
</h:column>
<h:dataTable value="#{questions.answers}" var="answers">
<tr>
<h:outputText value="#{answers.answer}" />
</tr>
</h:dataTable>
</h:dataTable>
You need to put columns inside a <h:column>.
<h:dataTable value="#{questionBacking.recentlyAskedQuestions}" var="question" rendered="#{not empty questionBacking.recentlyAskedQuestions}">
<h:column>
<h:outputText value="#{question.questionTitle}" />
<br/>
<h:outputText value="#{question.questionBody}" />
</h:column>
<h:column>
<h:dataTable value="#{question.answers}" var="answer">
<h:column>
<h:outputText value="#{answer.answer}" />
</h:column>
</h:dataTable>
</h:column>
</h:dataTable>
(note that I changed the rendered and the var attributes to be a bit more self-documenting, you might want to rename questionTitle, questionBody and answer to title, body and body respectively as well so that you don't keep duplicating the meaning)
You can do the same thing mentioned in BalusC's answer using PrimeFaces as well. Just replace <h:dataTable> with <p:dataTable> and the same goes for column tags as well. You can create nested datatable with PrimeFaces. I recommend people to use PrimeFaces as it reduces the amount of time people spend on writing/modifying css definitions.