I have some problem evaluating expression in a Facelets component defined in a .taglib.xml
SortField2.getExpression()
gives me the value "#{sortBy}" instead of evaluating the value.
My component (a simple column) is defined as:
<ui:composition>
<rich:column sortBy="#{sortBy}" width="#{width}" styleClass="#{styleClass}">
<f:facet name="header">#{header}</f:facet>
<ui:insert />
</rich:column>
</ui:composition>
I see that in TagValueExpression there is a "original" field which contains my value, but unfortunately it is private.
Any idea on how to extract it?
Also posted on Richfaces Forum
Thank you for your help.
You may be able to get "sortExpression" to work, instead of using "sortBy".
Also, instead of #{sortBy}, would ${sortBy} do any good? (A long shot)
Related
The following code is inspired from PrimeFaces DataGrid + DataTable Tutorials and put into a <p:tab> of a <p:tabView> residing in a <p:layoutUnit> of a <p:layout>. Here is the inner part of the code (starting from p:tab component); the outer part is trivial.
<p:tabView id="tabs">
<p:tab id="search" title="Search">
<h:form id="insTable">
<p:dataTable id="table" var="lndInstrument" value="#{instrumentBean.instruments}">
<p:column>
<p:commandLink id="select" update="insTable:display" oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
</p:column>
</p:dataTable>
<p:dialog id="dlg" modal="true" widgetVar="dlg">
<h:panelGrid id="display">
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
</h:form>
</p:tab>
</p:tabView>
When I click the <p:commandLink>, the code stops working and gives the message:
Cannot find component with expression "insTable:display" referenced from "tabs:insTable:select".
When I try the same using <f:ajax>, then it fails with a different message basically telling the same:
<f:ajax> contains an unknown id "insTable:display" cannot locate it in the context of the component "tabs:insTable:select"
When it happens during another Ajax postback and the JSF project stage is set to Development, then it fails with a JavaScript alert with the message:
malformedXML: During update: insTable:display not found
How is this caused and how can I solve it?
Look in HTML output for actual client ID
You need to look in the generated HTML output to find out the right client ID. Open the page in browser, do a rightclick and View Source. Locate the HTML representation of the JSF component of interest and take its id as client ID. You can use it in an absolute or relative way depending on the current naming container. See following chapter.
Note: if it happens to contain iteration index like :0:, :1:, etc (because it's inside an iterating component), then you need to realize that updating a specific iteration round is not always supported. See bottom of answer for more detail on that.
Memorize NamingContainer components and always give them a fixed ID
If a component which you'd like to reference by ajax process/execute/update/render is inside the same NamingContainer parent, then just reference its own ID.
<h:form id="form">
<p:commandLink update="result"> <!-- OK! -->
<h:panelGroup id="result" />
</h:form>
If it's not inside the same NamingContainer, then you need to reference it using an absolute client ID. An absolute client ID starts with the NamingContainer separator character, which is by default :.
<h:form id="form">
<p:commandLink update="result"> <!-- FAIL! -->
</h:form>
<h:panelGroup id="result" />
<h:form id="form">
<p:commandLink update=":result"> <!-- OK! -->
</h:form>
<h:panelGroup id="result" />
<h:form id="form">
<p:commandLink update=":result"> <!-- FAIL! -->
</h:form>
<h:form id="otherform">
<h:panelGroup id="result" />
</h:form>
<h:form id="form">
<p:commandLink update=":otherform:result"> <!-- OK! -->
</h:form>
<h:form id="otherform">
<h:panelGroup id="result" />
</h:form>
NamingContainer components are for example <h:form>, <h:dataTable>, <p:tabView>, <cc:implementation> (thus, all composite components), etc. You recognize them easily by looking at the generated HTML output, their ID will be prepended to the generated client ID of all child components. Note that when they don't have a fixed ID, then JSF will use an autogenerated ID in j_idXXX format. You should absolutely avoid that by giving them a fixed ID. The OmniFaces NoAutoGeneratedIdViewHandler may be helpful in this during development.
If you know to find the javadoc of the UIComponent in question, then you can also just check in there whether it implements the NamingContainer interface or not. For example, the HtmlForm (the UIComponent behind <h:form> tag) shows it implements NamingContainer, but the HtmlPanelGroup (the UIComponent behind <h:panelGroup> tag) does not show it, so it does not implement NamingContainer. Here is the javadoc of all standard components and here is the javadoc of PrimeFaces.
Solving your problem
So in your case of:
<p:tabView id="tabs"><!-- This is a NamingContainer -->
<p:tab id="search"><!-- This is NOT a NamingContainer -->
<h:form id="insTable"><!-- This is a NamingContainer -->
<p:dialog id="dlg"><!-- This is NOT a NamingContainer -->
<h:panelGrid id="display">
The generated HTML output of <h:panelGrid id="display"> looks like this:
<table id="tabs:insTable:display">
You need to take exactly that id as client ID and then prefix with : for usage in update:
<p:commandLink update=":tabs:insTable:display">
Referencing outside include/tagfile/composite
If this command link is inside an include/tagfile, and the target is outside it, and thus you don't necessarily know the ID of the naming container parent of the current naming container, then you can dynamically reference it via UIComponent#getNamingContainer() like so:
<p:commandLink update=":#{component.namingContainer.parent.namingContainer.clientId}:display">
Or, if this command link is inside a composite component and the target is outside it:
<p:commandLink update=":#{cc.parent.namingContainer.clientId}:display">
Or, if both the command link and target are inside same composite component:
<p:commandLink update=":#{cc.clientId}:display">
See also Get id of parent naming container in template for in render / update attribute
How does it work under the covers
This all is specified as "search expression" in the UIComponent#findComponent() javadoc:
A search expression consists of either an identifier (which is matched exactly against the id property of a UIComponent, or a series of such identifiers linked by the UINamingContainer#getSeparatorChar character value. The search algorithm should operates as follows, though alternate alogrithms may be used as long as the end result is the same:
Identify the UIComponent that will be the base for searching, by stopping as soon as one of the following conditions is met:
If the search expression begins with the the separator character (called an "absolute" search expression), the base will be the root UIComponent of the component tree. The leading separator character will be stripped off, and the remainder of the search expression will be treated as a "relative" search expression as described below.
Otherwise, if this UIComponent is a NamingContainer it will serve as the basis.
Otherwise, search up the parents of this component. If a NamingContainer is encountered, it will be the base.
Otherwise (if no NamingContainer is encountered) the root UIComponent will be the base.
The search expression (possibly modified in the previous step) is now a "relative" search expression that will be used to locate the component (if any) that has an id that matches, within the scope of the base component. The match is performed as follows:
If the search expression is a simple identifier, this value is compared to the id property, and then recursively through the facets and children of the base UIComponent (except that if a descendant NamingContainer is found, its own facets and children are not searched).
If the search expression includes more than one identifier separated by the separator character, the first identifier is used to locate a NamingContainer by the rules in the previous bullet point. Then, the findComponent() method of this NamingContainer will be called, passing the remainder of the search expression.
Note that PrimeFaces also adheres the JSF spec, but RichFaces uses "some additional exceptions".
"reRender" uses UIComponent.findComponent() algorithm (with some additional exceptions) to find the component in the component tree.
Those additional exceptions are nowhere in detail described, but it's known that relative component IDs (i.e. those not starting with :) are not only searched in the context of the closest parent NamingContainer, but also in all other NamingContainer components in the same view (which is a relatively expensive job by the way).
Never use prependId="false"
If this all still doesn't work, then verify if you aren't using <h:form prependId="false">. This will fail during processing the ajax submit and render. See also this related question: UIForm with prependId="false" breaks <f:ajax render>.
Referencing specific iteration round of iterating components
It was for long time not possible to reference a specific iterated item in iterating components like <ui:repeat> and <h:dataTable> like so:
<h:form id="form">
<ui:repeat id="list" value="#{['one','two','three']}" var="item">
<h:outputText id="item" value="#{item}" /><br/>
</ui:repeat>
<h:commandButton value="Update second item">
<f:ajax render=":form:list:1:item" />
</h:commandButton>
</h:form>
However, since Mojarra 2.2.5 the <f:ajax> started to support it (it simply stopped validating it; thus you would never face the in the question mentioned exception anymore; another enhancement fix is planned for that later).
This only doesn't work yet in current MyFaces 2.2.7 and PrimeFaces 5.2 versions. The support might come in the future versions. In the meanwhile, your best bet is to update the iterating component itself, or a parent in case it doesn't render HTML, like <ui:repeat>.
When using PrimeFaces, consider Search Expressions or Selectors
PrimeFaces Search Expressions allows you to reference components via JSF component tree search expressions. JSF has several builtin:
#this: current component
#form: parent UIForm
#all: entire document
#none: nothing
PrimeFaces has enhanced this with new keywords and composite expression support:
#parent: parent component
#namingcontainer: parent UINamingContainer
#widgetVar(name): component as identified by given widgetVar
You can also mix those keywords in composite expressions such as #form:#parent, #this:#parent:#parent, etc.
PrimeFaces Selectors (PFS) as in #(.someclass) allows you to reference components via jQuery CSS selector syntax. E.g. referencing components having all a common style class in the HTML output. This is particularly helpful in case you need to reference "a lot of" components. This only prerequires that the target components have all a client ID in the HTML output (fixed or autogenerated, doesn't matter). See also How do PrimeFaces Selectors as in update="#(.myClass)" work?
first of all: as far as i know placing dialog inside a tabview is a bad practice... you better take it out...
and now to your question:
sorry, took me some time to get what exactly you wanted to implement,
did at my web app myself just now, and it works
as I sayed before place the p:dialog out side the `p:tabView ,
leave the p:dialog as you initially suggested :
<p:dialog modal="true" widgetVar="dlg">
<h:panelGrid id="display">
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
and the p:commandlink should look like this (all i did is to change the update attribute)
<p:commandLink update="display" oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
the same works in my web app, and if it does not work for you , then i guess there is something wrong in your java bean code...
It's because the tab is a naming container aswell... your update should be update="Search:insTable:display" What you can do aswell is just place your dialog outside the form and still inside the tab then it would be: update="Search:display"
Please note that from PrimeFaces 10 and up, you are able to use observer and event.
This allows you to update components based on a custom event name, set by the #obs(event) keyword. For example:
<p:commandButton update="#obs(myEvent)"/>
<h:panelGroup>
<p:autoUpdate on="myEvent"/>
</h:panelGroup>
See:
https://www.primefaces.org/showcase/ui/ajax/observer.xhtml
I know this already has a great answer by BalusC but here is a little trick I use to get the container to tell me the correct clientId.
Remove the update on your component that is not working
Put a temporary component with a bogus update within the component you were trying to update
hit the page, the servlet exception error will tell you the correct client Id you need to reference.
Remove bogus component and put correct clientId in the original update
Here is code example as my words may not describe it best.
<p:tabView id="tabs">
<p:tab id="search" title="Search">
<h:form id="insTable">
<p:dataTable id="table" var="lndInstrument" value="#{instrumentBean.instruments}">
<p:column>
<p:commandLink id="select"
Remove the failing update within this component
oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
</p:column>
</p:dataTable>
<p:dialog id="dlg" modal="true" widgetVar="dlg">
<h:panelGrid id="display">
Add a component within the component of the id you are trying to update using an update that will fail
<p:commandButton id="BogusButton" update="BogusUpdate"></p:commandButton>
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
</h:form>
</p:tab>
</p:tabView>
Hit this page and view the error.
The error is:
javax.servlet.ServletException: Cannot find component for expression "BogusUpdate" referenced from
tabs:insTable: BogusButton
So the correct clientId to use would then be the bold plus the id of the target container (display in this case)
tabs:insTable:display
Try change update="insTable:display" to update="display". I believe you cannot prefix the id with the form ID like that.
I'm working with Primefaces 5.3.
First, I implemented functionality to change visibility of a p:selectOneMenu depending on the value of a p:selectBooleanCheckbox according to this post:
Enabling and disabling components via select checkbox
This works so far, if I use the h:form.
Next, I wanted to update the values in the bean, as chosen in the p:selectOneMenu. This is where my question starts: Even if i use p:ajax to explicitly call a listener, it won't get called. This is my code:
<h:panelGrid>
<p:selectOneMenu value="#{schedulerCDIBean.selectedParentTask}" var="parentTask" id="taskDependence" disabled="#{task.dependsOn != 'true'}">
<p:ajax event="change" listener="#{schedulerCDIBean.taskToAddListener}"/>
<f:selectItems id="taskDependenceItems" value="#{schedulerCDIBean.taskWebDataObjectList}" var="item" itemLabel="#{item.taskName}"
itemValue="#{item}" />
<p:column>
<h:outputText value="#{parentTask}"/>
</p:column>
</p:selectOneMenu>
</h:panelGrid>
And here is how I enable/disable the selectOneMenu:
<p:selectBooleanCheckbox id="dependsOnTask" value="#{task.dependsOn}" itemLabel="Depends On">
<p:ajax update="taskDependence" process="#this"/>
</p:selectBooleanCheckbox>
All this lives inside a p:tab of the p:accordionPanel where 'task' is the var of my DataObject-List.
As mentioned by #BalusC in this post: commandLink/commandButton/ajax backing bean action/listener method not invoked (Possible Causes: 2),
"You cannot nest multiple UIForm components in each other."
So, if i remove the h:form directive, the call to the listener in the bean works. But now, the value of the p:selectBooleanCheckbox is always set to 'false', and thus the component is not being updated to visible.
I found a post here, where OP had the same problem and solved it by adding the h:form directive.
EDIT:
My 'form' is a ui:composition and starts like this <ui:composition template="/templates/pages/mainPage.xhtml">, where mainPage.xhtml contains h:head and includes the 'header.xhtml' by using ui:include, and there is a h:form. But this h:form is already closed before, so the problem isn't here.
Well, I don't want to go the way with adding the h:form again, as it leads to unspecified behaviour. But what am I doing wrong, if my p:selectBooleanCheckbox values are not being set correctly?
Thank you for your help!
UPDATE
The problem was not the h:form, as it actually wasn't nested. Now I'm just still stuck with the listeners for the p:selectOneMenu, as they aren't being called. I also tried setting partialSubmit="true" on the <p:ajax />, which did not lead to a solution so far.
Thanks for your help, guys. With your help I fixed the problem.
Just as if someone else experiences similar problems, here a few things to check:
Check #BalusC's answer here, as also mentioned in #irieill's answer.
Check if you're having equals() and hashCode() of the object you're willing to show in the selectOneMenu.
The solution for my situation actually was mentioned in #irieill's comment:
[..]Not providing a proper converter does not raise any exceptions but faces error messages. So try to add a <p:growl autoUpdate="true" /> to your page to see if any conversion error is raised. If so, add a propper converter to your selectOneMenu.
I think, that's also what #BalusC said at point 3 of his list of possible causes.
See also: How to write a custom converter for <p:pickList>, Custom converter in JSF 2.0, PrimeFaces ShowCase: SelectOneMenu
As mentioned by #BalusC in this post: commandLink/commandButton/ajax backing bean action/listener method not invoked
Also note point 1. You must enclose your input components with a <h:form /> tag.
Well, I don't want to go the way with adding the h:form again, as it leads to unspecified behaviour.
As i understand, you are misusing the tag or you do not understand how to use it. Just enclose your whole page (or at least all input components) in one <h:form /> tag and it should work.
Can you please update your question with the page code also containing the lines where you placed the <h:form /> tag(s).
I need some JSF / PrimeFaces (3.5) advice.
We have a dynamic form, the form can be configured by a form builder, and the backing bean is a glorified HashMap with some additional getters and setters like (getValueAsDate/setValueAsDate).
One of our field types allows for entering a number and when leaving the field additional information is requested and part of the form is updated. This appeared all to work nicely.
<h:panelGroup id="clientInfo" layout="block" rendered="#{field.type == 'CLIENTINFO'}">
<h:outputLabel for="inputClientId">#{field.label}</h:outputLabel>
<p:inputText id="inputClientId" maxlength="9" value="#{handler.property(field.id).value}">
<p:ajax listener="#{handler.fetchClientDetails(field.id)}" partialSubmit="true" process="#this" update="#parent,:mainform:msgs"
</p:inputText>
<!-- Additional output text elements to display the name, address etc. -->
</h:panelGroup>
Recently we added a field which allowed for entering a java.util.Date using the PrimeFaces date picker component. After adding this field type the partial update stopped working.
<h:panelGroup id="date" layout="block" rendered="#{field.type == 'DATE'}">
<h:outputLabel for="inputDate">#{field.label}</h:outputLabel>
<p:calendar id="inputDate" value="#{handler.property(field.id).valueAsDate}" pattern="dd-MM-yyyy" maxlength="10">
<f:convertDateTime pattern="dd-MM-yyyy" />
</p:calendar>
</h:panelGroup>
When inspecting the partial result from the server we got something like the following (where 12345 is the clientId entered in the field above).
<partial-response>
<error>
<error-name>class java.text.ParseException</error-name>
<error-message><![CDATA[Unparseable date: "12345"]]></error-message>
</error>
</partial-response>
The question is basically why is it even calling the getValueAsDate method for a field that isn't a Date or when there is even no date field type on the screen? It is probably something I'm missing (or misunderstanding) about the JSF Lifecycle or how partial updates work in JSF / PrimeFaces.
Update #1:
Just noticed in another debugging session that this isn't only happening for a partial update but already when initially rendering the screen. It appears as if all EL expressions are evaluated all the time, this also results in additional properties in my backing object (when a property is requested and it doesn't exists it is created with the value null).
Update #2:
The code to render the configured fields uses a ui:repeat en conditional ui:fragments (tried h:panelGroups as well) to render the specific input element for the configured field.
<ui:repeat value=#{handler.formFields} var="field">
<ui:fragment rendered="field.type == 'DATE'>
<!-- Specific fragment for date field -->
</ui:fragment>
<ui:fragment rendered="field.type == 'TEXT'>
</ui:fragment>
<ui:fragment rendered="field.type == 'REGEXP'>
</ui:fragment>
<ui:fragment rendered="field.type == 'CLIENT'>
</ui:fragment>
</ui:repeat>
Tried both h:panelGroup and ui:fragments combinations of the 2.
This is recognizable as a Mojarra specific <ui:repeat> bug which was reported as issue 3215, fixed in 2.2.7 and backported in 2.1.29 as per issue 3221. Simply put, the issue boils down to that the <ui:repeat> didn't respect the state of its EditableValueHolder children when saving own state, hereby basically behaving as if rendered attribute of those children was never respected during state saving. One of other consequences is fleshed out in the following related Q&A: PropertyNotFoundException on conditionally rendered subclasses in ui:repeat.
Given that you're on Mojarra 2.1.x, your best bet is to upgrade to at least 2.1.29. If your environment allows it (Servlet 3.0 and such), upgrading to latest 2.2.x should also be possible.
Alternatives would be replacing Mojarra by MyFaces, or replacing <ui:repeat><ui:fragment> by <c:forEach><c:if>.
I am working in JSF2 and I have displayed a resource bundle to display messages from property files.
The configuration seems to be great (if I call #{msg.risk} "toto" is displayed)
messages.properties
...
COMPANYGROWTH=E249
RISK=TOTO
I would like to do this kind of thing :
View
<f:loadBundle basename="toto" var="msg"/>
...
<p:column>
<h:outputText value="#{msg.#{key}}" />
</p:column>
Putting an EL in an EL like #{msg.#{key}} where key would be a declared row value in a datatable. Is there a way to do it ?
Thanks
For that you should be using the brace notation #{bean[property]}.
Thus, so:
<h:outputText value="#{msg[key]}" />
Note that nesting EL expressions is always invalid syntax. You should see #{...} as one big evaluation space where variables interact with each other. You should not see #{...} as a single variable.
See also:
Our EL wiki page
The following code is inspired from PrimeFaces DataGrid + DataTable Tutorials and put into a <p:tab> of a <p:tabView> residing in a <p:layoutUnit> of a <p:layout>. Here is the inner part of the code (starting from p:tab component); the outer part is trivial.
<p:tabView id="tabs">
<p:tab id="search" title="Search">
<h:form id="insTable">
<p:dataTable id="table" var="lndInstrument" value="#{instrumentBean.instruments}">
<p:column>
<p:commandLink id="select" update="insTable:display" oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
</p:column>
</p:dataTable>
<p:dialog id="dlg" modal="true" widgetVar="dlg">
<h:panelGrid id="display">
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
</h:form>
</p:tab>
</p:tabView>
When I click the <p:commandLink>, the code stops working and gives the message:
Cannot find component with expression "insTable:display" referenced from "tabs:insTable:select".
When I try the same using <f:ajax>, then it fails with a different message basically telling the same:
<f:ajax> contains an unknown id "insTable:display" cannot locate it in the context of the component "tabs:insTable:select"
When it happens during another Ajax postback and the JSF project stage is set to Development, then it fails with a JavaScript alert with the message:
malformedXML: During update: insTable:display not found
How is this caused and how can I solve it?
Look in HTML output for actual client ID
You need to look in the generated HTML output to find out the right client ID. Open the page in browser, do a rightclick and View Source. Locate the HTML representation of the JSF component of interest and take its id as client ID. You can use it in an absolute or relative way depending on the current naming container. See following chapter.
Note: if it happens to contain iteration index like :0:, :1:, etc (because it's inside an iterating component), then you need to realize that updating a specific iteration round is not always supported. See bottom of answer for more detail on that.
Memorize NamingContainer components and always give them a fixed ID
If a component which you'd like to reference by ajax process/execute/update/render is inside the same NamingContainer parent, then just reference its own ID.
<h:form id="form">
<p:commandLink update="result"> <!-- OK! -->
<h:panelGroup id="result" />
</h:form>
If it's not inside the same NamingContainer, then you need to reference it using an absolute client ID. An absolute client ID starts with the NamingContainer separator character, which is by default :.
<h:form id="form">
<p:commandLink update="result"> <!-- FAIL! -->
</h:form>
<h:panelGroup id="result" />
<h:form id="form">
<p:commandLink update=":result"> <!-- OK! -->
</h:form>
<h:panelGroup id="result" />
<h:form id="form">
<p:commandLink update=":result"> <!-- FAIL! -->
</h:form>
<h:form id="otherform">
<h:panelGroup id="result" />
</h:form>
<h:form id="form">
<p:commandLink update=":otherform:result"> <!-- OK! -->
</h:form>
<h:form id="otherform">
<h:panelGroup id="result" />
</h:form>
NamingContainer components are for example <h:form>, <h:dataTable>, <p:tabView>, <cc:implementation> (thus, all composite components), etc. You recognize them easily by looking at the generated HTML output, their ID will be prepended to the generated client ID of all child components. Note that when they don't have a fixed ID, then JSF will use an autogenerated ID in j_idXXX format. You should absolutely avoid that by giving them a fixed ID. The OmniFaces NoAutoGeneratedIdViewHandler may be helpful in this during development.
If you know to find the javadoc of the UIComponent in question, then you can also just check in there whether it implements the NamingContainer interface or not. For example, the HtmlForm (the UIComponent behind <h:form> tag) shows it implements NamingContainer, but the HtmlPanelGroup (the UIComponent behind <h:panelGroup> tag) does not show it, so it does not implement NamingContainer. Here is the javadoc of all standard components and here is the javadoc of PrimeFaces.
Solving your problem
So in your case of:
<p:tabView id="tabs"><!-- This is a NamingContainer -->
<p:tab id="search"><!-- This is NOT a NamingContainer -->
<h:form id="insTable"><!-- This is a NamingContainer -->
<p:dialog id="dlg"><!-- This is NOT a NamingContainer -->
<h:panelGrid id="display">
The generated HTML output of <h:panelGrid id="display"> looks like this:
<table id="tabs:insTable:display">
You need to take exactly that id as client ID and then prefix with : for usage in update:
<p:commandLink update=":tabs:insTable:display">
Referencing outside include/tagfile/composite
If this command link is inside an include/tagfile, and the target is outside it, and thus you don't necessarily know the ID of the naming container parent of the current naming container, then you can dynamically reference it via UIComponent#getNamingContainer() like so:
<p:commandLink update=":#{component.namingContainer.parent.namingContainer.clientId}:display">
Or, if this command link is inside a composite component and the target is outside it:
<p:commandLink update=":#{cc.parent.namingContainer.clientId}:display">
Or, if both the command link and target are inside same composite component:
<p:commandLink update=":#{cc.clientId}:display">
See also Get id of parent naming container in template for in render / update attribute
How does it work under the covers
This all is specified as "search expression" in the UIComponent#findComponent() javadoc:
A search expression consists of either an identifier (which is matched exactly against the id property of a UIComponent, or a series of such identifiers linked by the UINamingContainer#getSeparatorChar character value. The search algorithm should operates as follows, though alternate alogrithms may be used as long as the end result is the same:
Identify the UIComponent that will be the base for searching, by stopping as soon as one of the following conditions is met:
If the search expression begins with the the separator character (called an "absolute" search expression), the base will be the root UIComponent of the component tree. The leading separator character will be stripped off, and the remainder of the search expression will be treated as a "relative" search expression as described below.
Otherwise, if this UIComponent is a NamingContainer it will serve as the basis.
Otherwise, search up the parents of this component. If a NamingContainer is encountered, it will be the base.
Otherwise (if no NamingContainer is encountered) the root UIComponent will be the base.
The search expression (possibly modified in the previous step) is now a "relative" search expression that will be used to locate the component (if any) that has an id that matches, within the scope of the base component. The match is performed as follows:
If the search expression is a simple identifier, this value is compared to the id property, and then recursively through the facets and children of the base UIComponent (except that if a descendant NamingContainer is found, its own facets and children are not searched).
If the search expression includes more than one identifier separated by the separator character, the first identifier is used to locate a NamingContainer by the rules in the previous bullet point. Then, the findComponent() method of this NamingContainer will be called, passing the remainder of the search expression.
Note that PrimeFaces also adheres the JSF spec, but RichFaces uses "some additional exceptions".
"reRender" uses UIComponent.findComponent() algorithm (with some additional exceptions) to find the component in the component tree.
Those additional exceptions are nowhere in detail described, but it's known that relative component IDs (i.e. those not starting with :) are not only searched in the context of the closest parent NamingContainer, but also in all other NamingContainer components in the same view (which is a relatively expensive job by the way).
Never use prependId="false"
If this all still doesn't work, then verify if you aren't using <h:form prependId="false">. This will fail during processing the ajax submit and render. See also this related question: UIForm with prependId="false" breaks <f:ajax render>.
Referencing specific iteration round of iterating components
It was for long time not possible to reference a specific iterated item in iterating components like <ui:repeat> and <h:dataTable> like so:
<h:form id="form">
<ui:repeat id="list" value="#{['one','two','three']}" var="item">
<h:outputText id="item" value="#{item}" /><br/>
</ui:repeat>
<h:commandButton value="Update second item">
<f:ajax render=":form:list:1:item" />
</h:commandButton>
</h:form>
However, since Mojarra 2.2.5 the <f:ajax> started to support it (it simply stopped validating it; thus you would never face the in the question mentioned exception anymore; another enhancement fix is planned for that later).
This only doesn't work yet in current MyFaces 2.2.7 and PrimeFaces 5.2 versions. The support might come in the future versions. In the meanwhile, your best bet is to update the iterating component itself, or a parent in case it doesn't render HTML, like <ui:repeat>.
When using PrimeFaces, consider Search Expressions or Selectors
PrimeFaces Search Expressions allows you to reference components via JSF component tree search expressions. JSF has several builtin:
#this: current component
#form: parent UIForm
#all: entire document
#none: nothing
PrimeFaces has enhanced this with new keywords and composite expression support:
#parent: parent component
#namingcontainer: parent UINamingContainer
#widgetVar(name): component as identified by given widgetVar
You can also mix those keywords in composite expressions such as #form:#parent, #this:#parent:#parent, etc.
PrimeFaces Selectors (PFS) as in #(.someclass) allows you to reference components via jQuery CSS selector syntax. E.g. referencing components having all a common style class in the HTML output. This is particularly helpful in case you need to reference "a lot of" components. This only prerequires that the target components have all a client ID in the HTML output (fixed or autogenerated, doesn't matter). See also How do PrimeFaces Selectors as in update="#(.myClass)" work?
first of all: as far as i know placing dialog inside a tabview is a bad practice... you better take it out...
and now to your question:
sorry, took me some time to get what exactly you wanted to implement,
did at my web app myself just now, and it works
as I sayed before place the p:dialog out side the `p:tabView ,
leave the p:dialog as you initially suggested :
<p:dialog modal="true" widgetVar="dlg">
<h:panelGrid id="display">
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
and the p:commandlink should look like this (all i did is to change the update attribute)
<p:commandLink update="display" oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
the same works in my web app, and if it does not work for you , then i guess there is something wrong in your java bean code...
It's because the tab is a naming container aswell... your update should be update="Search:insTable:display" What you can do aswell is just place your dialog outside the form and still inside the tab then it would be: update="Search:display"
Please note that from PrimeFaces 10 and up, you are able to use observer and event.
This allows you to update components based on a custom event name, set by the #obs(event) keyword. For example:
<p:commandButton update="#obs(myEvent)"/>
<h:panelGroup>
<p:autoUpdate on="myEvent"/>
</h:panelGroup>
See:
https://www.primefaces.org/showcase/ui/ajax/observer.xhtml
I know this already has a great answer by BalusC but here is a little trick I use to get the container to tell me the correct clientId.
Remove the update on your component that is not working
Put a temporary component with a bogus update within the component you were trying to update
hit the page, the servlet exception error will tell you the correct client Id you need to reference.
Remove bogus component and put correct clientId in the original update
Here is code example as my words may not describe it best.
<p:tabView id="tabs">
<p:tab id="search" title="Search">
<h:form id="insTable">
<p:dataTable id="table" var="lndInstrument" value="#{instrumentBean.instruments}">
<p:column>
<p:commandLink id="select"
Remove the failing update within this component
oncomplete="dlg.show()">
<f:setPropertyActionListener value="#{lndInstrument}"
target="#{instrumentBean.selectedInstrument}" />
<h:outputText value="#{lndInstrument.name}" />
</p:commandLink>
</p:column>
</p:dataTable>
<p:dialog id="dlg" modal="true" widgetVar="dlg">
<h:panelGrid id="display">
Add a component within the component of the id you are trying to update using an update that will fail
<p:commandButton id="BogusButton" update="BogusUpdate"></p:commandButton>
<h:outputText value="Name:" />
<h:outputText value="#{instrumentBean.selectedInstrument.name}" />
</h:panelGrid>
</p:dialog>
</h:form>
</p:tab>
</p:tabView>
Hit this page and view the error.
The error is:
javax.servlet.ServletException: Cannot find component for expression "BogusUpdate" referenced from
tabs:insTable: BogusButton
So the correct clientId to use would then be the bold plus the id of the target container (display in this case)
tabs:insTable:display
Try change update="insTable:display" to update="display". I believe you cannot prefix the id with the form ID like that.