f:ajax render referencing iterated component - jsf

Question

I have xhtml with following structure:
<h:form id="frmMain2">
<f:subview id="sub1">
<ui:repeat var="vatId" value="#{someBean.suppliesKeys()}" id="rep1">
<fieldset>
<legend>vatId</legend>
<h:panelGroup id="panel">
<ui:repeat var="item" value="#{someBean.supplies[vatId]}" id="rep2">
<f:subview id="sub2">
<h:commandLink id="command">
${item}
<f:ajax
event="click"
render=":frmMain2:sub1:rep1:0:panel">
</f:ajax>
</h:commandLink>
</f:subview>
</ui:repeat>
</h:panelGroup>
</fieldset>
</ui:repeat>
</f:subview>
</h:form>
This is running in Websphere Portlet via portlet bridge which means I am stuck with Myfaces 2.0.
The problem I am facing is that I am getting following error:
javax.portlet.PortletException: Component with id::frmMain2:sub1:rep1:0:panel not found
Notice that I am trying to reference first iteration of panel inside f:ajax render (:frmMain2:sub1:rep1:0:panel).
If I referenced something else (outside iterated part), e.g. :frmMain2:sub1:rep1, component is found and portlet works.
I am unable to find how do I reference some iterated component in render attribute.
Found following post where this problem is described as resolved in Mojarra newer version, but Myfaces 2.2.7 does not solve the problem: How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"
So, Is there a way to reference the component I want to render in f:ajax?

Answer 1

Since you only want to render the first iteration, you could create a custom component, tag, or template that encapsulates the components that you are iterating over as a workaround:
<fieldset>
<legend>vatId</legend>
<h:panelGroup id="panel">
<ui:repeat var="item" value="#{someBean.supplies[vatId]}" id="rep2">
<f:subview id="sub2">
<h:commandLink id="command">
${item}
<f:ajax
event="click"
render=":frmMain2:sub1:rep1:0:panel">
</f:ajax>
</h:commandLink>
</f:subview>
</ui:repeat>
</h:panelGroup>
</fieldset>
Then you could hard code the first option. Here's some example code (you'll definitely need to adapt this since I don't have all the info about your model data):
<h:form id="frmMain2">
<f:subview id="sub1">
<custom:component id="first" items="#{someBean.supplies[hardcodedFirstKey]}">
<f:ajax event="click" render="#this" />
</custom:component>
<ui:repeat var="vatId" value="#{someBean.suppliesKeys()}" id="rep1">
<custom:component items="#{someBean.supplies[vatId]}" rendered="#{!key eq hardcodedFirstKey}">
<f:ajax event="click" render=":frmMain:sub1:first" />
</custom:component>
</ui:repeat>
</f:subview>
</h:form>