I am trying to use Ajax updates triggered from a component within a p:dataTable
to update the footer of the table. But no matter how I write my ID references in the p:ajax
tag I don't seem to be able to get them right.
This is an example:
<h:form id="formId">
<p:dataTable id="tableId" var="row" value="#{testBean.dataRows}" rowIndexVar="rowIx">
<p:column>
<h:outputText value="#{row}"/>
<p:inputText id="innerInputId" value="#{testBean.str}">
<p:ajax event="keyup" update="tableId:footerId"/>
<p:ajax event="keyup" update=":formId:tableId:footerId"/>
<p:ajax event="keyup" update="@form:tableId:footerId"/>
</p:inputText>
<f:facet name="footer">
<h:outputText id="footerId" value="#{testBean.str}"/>
</f:facet>
</p:column>
</p:dataTable>
<p:inputText id="outerInputId" value="#{testBean.str}">
<p:ajax event="keyup" update="tableId:footerId"/>
</p:inputText>
</h:form>
In the generated HTML I can see that the outputText
in the footer gets the ID formId:tableId:footerId
.
The reference from outerInputId
works fine.
All of the references from innerInputId
I expect to work, but they don't. In the generated HTML I can see that they are translated into the form formId:tableId:0:footerId
. This would make sense if the footer was located inside the naming container of the current row, but it isn't as I can see from its ID.
I smell a bug here. Am I right? How can I work around it?
Or is this expected behaviour, and in that case why?
I want to do this to display the sum of all the cells in the column in the footer.
Relevant software: PrimeFaces 5.1, Mojarra 2.2.7, GlassFish 4.1