I am working on creating a dynamic table using JSTL forEach and a h:dataTable and have all of the controls and potential error message showing nicely, but am now stuck on getting the value set for each of the control. I will need to create (I think) a dynamic EL expression to set the value, but have not been able to get any of my versions to work. I was hoping to build out the expression using c:out, but found out that that tag is not available in JSF2.
So, is it possible to build a dynamic expression in the page?
How can I set the expression in the backing bean if the control hasn't been built yet ?
<h:dataTable id="dtDetails" styleClass="slate_table" value="#{remediationDetail.eventList}" var="dataItem">
<c:forEach items="#{remediationDetail.eventHeaders}" var="key">
<h:column>
<f:facet name="header">#{key.fieldDefinition.fieldConfiguration.customLabel}</f:facet>
<h:inputText value="" id="txtNumber" styleClass="remediation_textbox error_marker" title="#{remediationDetail.errorMessages(dataItem.id, key.fieldDefinition.id)}">
<f:convertNumber maxFractionDigits="0" maxIntegerDigits="19"/>
</h:column>
</c:forEach>
</h:dataTable>
As always, any help or direction is appreciated.
Regards,
Mike
I was not being able to create a Dynamic EL Expression. So, I ended using the index of the c:forEach to help define what values I am looking for. The only catch for this result is that I would be expecting the data that I am about to display to have the same number of positions in the array.
<c:forEach items="#{remediationDetail.eventHeaders}" var="key" varStatus="looper">
<h:column>
<f:facet name="header">#{key.fieldDefinition.fieldConfiguration.customLabel}</f:facet>
<h:inputText id="txtNumber" value="#{dataItem.entityList[looper.index].val}">
<f:convertNumber maxFractionDigits="0" maxIntegerDigits="19"/>
</h:inputText>
</h:column>
</c:forEach>
In my case the following helped to build dynamic EL.
<ui:param name="beanName" value="myBackedBean"/>
<ui:param name="propertyName" value="field1"/>
<ui:param name="nestedPropertyName" value="field1"/>
<p:inputTextarea value="#{sessionScope[beanName][propertyName][nestedPropertyName]}"/>
Inspired of this topic
Related
<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
I am using JSF 2.1 and ICEFaces 2 and I have a tabset like:
<ace:tabSet clientSide="true">
<ace:tabPane>
<f:facet name="label">My First Tab</f:facet>
<h:outputText value="One"></h:outputText>
</ace:tabPane>
<ace:tabPane>
<f:facet name="label">Second Tab</f:facet>
<h:outputText value="Two"></h:outputText>
</ace:tabPane>
<ace:tabPane>
<f:facet name="label">Third Tab</f:facet>
<h:outputText value="Third"></h:outputText>
</ace:tabPane>
</ace:tabSet>
Instead of hardcoding the tabPanes, I want to generate them dynamically based on a list. How can I achieve this by standard JSF or ICEFaces components?
I tried to use the <ui:repeat>, but it doesn't work:
<ui:repeat var="o" value="#{bean.myList}" varStatus="status">
<ace:tabPane>
<f:facet name="label">#{o.name}</f:facet>
<h:selectManyCheckbox value="#{o.valuesArray}" layout="pageDirection">
<f:selectItems value="#{o.checkboxes}" />
</h:selectManyCheckbox>
</ace:tabPane>
</ui:repeat>
I don't do ICEFaces, but you're encountering basically the same problem as RichFaces has with its <rich:tab>. As there exist no hypothetical <rich:tabs> (like as <rich:columns> which would be the dynamic variant of <rich:column>/<h:column>), one would have to use the view build time JSTL <c:forEach> tag to prepare the JSF view with those tags. You could apply the same on your ICEFaces page:
<ace:tabSet clientSide="true">
<c:forEach items="#{bean.tabs}" var="tab">
<ace:tabPane>
<f:facet name="label">#{tab.label}</f:facet>
<h:outputText value="#{tab.name}"></h:outputText>
</ace:tabPane>
</c:forEach>
</ace:tabSet>
Note that this will only fail if #{bean} is not a real managed bean, but an expression which in turn depends on an evaluation of another JSF component, such as <h:dataTable var="bean">.
The <ui:repeat> won't work as it's a render-time tag. It won't dynamically generate multiple JSF components before the JSF component tree is been built.
See also:
ICEFaces issue 6527 - Dynamically adding/removing ace:tabPane Results in ace:tabset Retrieving Entire Tabset Content
ICEFaces issue 6560 - New ace:tabs dynamic tabset component
i think you can write like this:
<ice:panelTabSet var="tab" value="#{mainTabsTempl.tabs}">
<ice:panelTab label="#{tab.label}">
body
</ice:panelTab>
</ice:panelTabSet>
It's not tabSet tag, but have the same work.
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.
I am new to JSF, so I have many problems with it. I have solved much, but now I have a problem when I make composite component of column.
This is the code:
myPage.xhtml:
<h:dataTable >
<util:myCol />
</h:dataTable>
myCol.xhtml:
<composite:interface>
</composite:interface>
<composite:implementation>
<h:column>
<f:facet name="header" >
<h:outputText value="user name" />
</f:facet>
<h:outputText value="some data" />
</h:column>
</composite:implementation>
The problem is that the column does not render.
So I have changed a little in code:
myPage.xhtml:
<h:dataTable >
<h:column>
<util:myCol />
</h:column>
</h:dataTable>
myCol.xhtml:
<composite:interface>
</composite:interface>
<composite:implementation>
<f:facet name="header" >
<h:outputText value="user name" />
</f:facet>
<h:outputText value="some data" />
</composite:implementation>
Here the column renders, but the header "user name" does not appear.
How to solve the problem? Thanks in advance.
Case 1:
dataTable only treats column control children as columns. You are adding a composite control to the dataTable and a the column to the composite control.
Case 2:
The problem is probably to do with where the facets are set. These are set on a map on the parent control. The control you are adding the header facet to is the composite control, not the column.
Note: the links are to JSF 1.2 (JEE5) stuff, but the principle still applies.
I don't know if you still follow this thread, but we had problems inserting facets due to a bug.
Starting the content inside the facet with a comment (server side comment < ! - - - - > ) may solve the problem showing the content. We encountered problems with facets having one liners in there.. putting an extra comment as the first statement is the workaround for the problem.
Kind regards,
Gijs
Does it render correctly when you have all of the JSF on one page? Setting up your JSF on a single page at first can be helpful to make sure that the basics are right; after that works, you can break it up into composite components.
Also, I have noticed (using JSF and Richfaces) that sometimes you can't separate 'parents' and 'children' at times; a rich:toolBar and it's rich:toolBarGroup's need to be on the same actual page, for example. I haven't worked with Facelets much so you might have a different situation.
Best of luck.
Edit:
Try pulling the header out of the composite control, i.e.:
<h:dataTable >
<h:column>
*HEADER_FACET_GOES_HERE*
<util:myCol />
</h:column>
</h:dataTable>
Use composite:facet in interface and composite:renderFacet or composite:insertFacet in implementation.
<composite:interface>
<composite:facet name="foo"/>
<composite:attribute name="value"/>
</composite:interface>
<composite:implementation>
<h:inputText id="value" value="#{cc.attrs.value}"/>
<composite:renderFacet name="foo"/>
<composite:insertChildren/>
</composite:implementation>
My problem is that RichFaces reRender does not work 'under' the current element in the element tree; only upper elements get rerendered.
Is there any way to access lower elements with AJAX?
Any help would be appreciated!
Daniel
EDIT I edited this question to a more general one. See revisions if interested in the original question.
reRender works with providing an the id of the target object you want to reRender (inside the same naming container - form most often)
the id should be a unique string, according to html spec
reRender allows dynamic value - i.e. reRender="#{myBean.currentItemsToRerender}
Based on that I think you should be able to achieve what you want (although it's not entirely clear)
Update:
UIComponent.findComponent(..) has a well-defined algorithm for resolving ids. So for absolute referencing your reRendered id should start with : and then continue through the hierarchy of the naming containers.
Here is an example where changePanel111() changes the content of a lower element:
<h:form id="form" prependId="true">
<rich:panel id="PANEL1">
<h:outputText id="PANEL1TEXT" value="#{ajaxTestBean.panel1}"/>
<rich:panel id="PANEL11">
<h:outputText id="PANEL11TEXT" value="#{ajaxTestBean.panel11}"/>
<rich:panel id="PANEL111">
<h:outputText id="PANEL111TEXT" value="#{ajaxTestBean.panel111}"/>
</rich:panel>
</rich:panel>
<rich:panel id="PANEL12">
<h:outputText id="PANEL12TEXT" value="#{ajaxTestBean.panel12}"/>
<br/>
<a4j:commandLink value="CHANGE PANEL12" action="#{ajaxTestBean.changePanel12}">
<a4j:support reRender="PANEL12" event="onclick"/>
</a4j:commandLink>
<br/>
<a4j:commandLink value="CHANGE PANEL111" action="#{ajaxTestBean.changePanel111}">
<a4j:support reRender="form:PANEL111" event="onclick"/>
</a4j:commandLink>
</rich:panel>
</rich:panel>
</h:form>
Notice how the lower element needs to be identified as form:PANEL111.
Hope this helps!
reRender can point to any component outside the form as well. For example this works:
<h:form>
<a4j:commandButton reRender="panel"/>
</h:form>
<h:panelGrid id="panel">
...
</h:panelGrid>
For my MyFaces+Richfaces App, <rich:panel> tag was not working as described in the selected answer. When I changed it to <a4j:outputPanel ajaxRendered="true" />, it started working as given here "<a4j:commandLink> Not Rerendering"
Configuration: MyFaces 2.1.10(Facelets used for templating) and Richfaces 4.2.3.
Hope this will help.