I want to use a ui:repeat or any other iterative tag to display a number of components once for each item in an Array list.
<!-- print multiple mandates -->
<ui:repeat id="mandates" var="mandate" value="#{taxheadDirectDebit.mandates}">
<a4j:region id="remittanceDetailsSection"
rendered="#{(taxheadDirectDebit.accountFinancialInfo.registration.type != 'PREM') or (taxheadDirectDebit.accountFinancialInfo.registration.type != 'VAT')}">
<!-- Remittance Details -->
<fieldset><legend class="sub"> <h:outputText
value="#{msg['remittanceDetails.title']}" /> </legend>
<!-- Estimated Liability -->
<div class="field">
<div class="label"><label for="allocatedAmount"><h:outputText
for="estimatedLiability"
value="#{msg['remittanceDetails.estimatedLiability']}" /> </label><span
class="requiredFlag">*</span></div>
<div class="error">
<rich:message styleClass="errorText" for="estimatedLiability" />
</div>
<div class="input">
<h:inputText id="estimatedLiability" size="30"
maxlength="11" label="#{msg['registerContractPage1.subTaxNumber']}"
value="#{taxheadDirectDebit.estimatedLiability}">
<a4j:ajax event="change" render="remittanceFrequency" />
</h:inputText>
</div>
<br class="clear" />
</div>
<!-- Is Seasonal -->
<div class="field">
<div class="label"><label for="isSeasonal"> <h:outputText
for="isSeasonal"
value="#{msg['remittanceDetails.isTheNatureSeasonal']}" /> </label><span
class="requiredFlag">*</span></div>
<div class="error"><rich:message styleClass="errorText"
for="isSeasonal" /></div>
<div class="input"><h:selectOneRadio id="isSeasonal"
label="#{msg['remittanceDetails.isTheNatureSeasonal']}"
value="#{taxheadDirectDebit.isSeasonal}"
styleClass="radioLabelTop">
<ddo:twoOptionSelection />
<a4j:ajax event="click" render="remittanceFrequency" />
</h:selectOneRadio></div>
<br class="clear" />
</div>
</fieldset>
</a4j:region>
<!-- Remittance Frequency -->
<a4j:outputPanel id="remittanceFrequency">
<div class="field">
<div class="label"><label for="allocatedAmount"><h:outputText
for="estimatedLiability"
value="#{msg['remittanceDetails.estimatedLiability']}" /> </label><span
class="requiredFlag">*</span></div>
<div class="error">
<rich:message styleClass="errorText" for="estimatedLiability" />
</div>
<div class="input">
<h:inputText id="estimatedLiability" size="30"
maxlength="11" label="#{msg['registerContractPage1.subTaxNumber']}"
value="#{taxheadDirectDebit.estimatedLiability}">
<a4j:ajax event="change" render=":remittanceDetails:mandates:remittanceFrequency" />
</h:inputText>
</div>
<br class="clear" />
</div>
<fieldset><legend class="sub"> <h:outputText
value="#{msg['remittanceDetails.frequency']}" /> </legend>
<!-- Amount to be Debited -->
<div class="field">
<div class="label"><label for="amountEachMonth"><h:outputText
for="amountEachMonth"
value="#{msg['remittanceDetails.amountToBeDebited']}" /> </label></div>
<div class="error"><rich:message styleClass="errorText"
for="amountEachMonth" /></div>
<div class="input"><h:inputText id="amountEachMonth" size="30" readOnly="true"
maxlength="8" label="#{msg['remittanceDetails.amountToBeDebited']}"
value="#{mandate.remittanceDetails.amountEachMonth}">
<a4j:ajax event="change" render="remittanceFrequencyNoDebitedEachMonth"/>
</h:inputText></div>
<br class="clear" />
</div>
<a4j:outputPanel id="remittanceFrequencyNoDebitedEachMonth">
<!-- Months -->
<div class="field">
<div class="grid1"><h:outputText
value=" " /> 
</div>
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}">
<div class="grid2"><div align="center">
<h:outputText value="#{msg['reviewDetails.reduce']}"/><div align="center"></div>
</div></div>
</rich:panel>
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.action == 'AMEND'}">
<div class="grid3">
<div align="center">
<h:outputText value="#{msg['reviewDetails.suspend']}"/><div align="center"></div>
</div>
</div>
</rich:panel>
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}">
<div class="grid2">
<div align="center">
<h:outputText value="#{msg['reviewDetails.exclude']}"/><div align="center"></div>
</div>
</div>
</rich:panel>
<br class="clear" />
<div class="floatleft">
<div class="row3">
<div class="row1">
<!-- January -->
<!-- Months Column -->
<div class="grid1">
<label>
<h:outputText readOnly="true" disabled="true" size="4" value="#{msg['calendar.month.0']}" />
</label>
</div>
<!-- Reduce check box -->
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}">
<div class="grid2">
<div align="center">
<h:selectBooleanCheckbox
id="reduce12"
value="#{mandate.remittanceDetails.remittanceFrequencys[0].reduce}"
disabled="#{mandate.remittanceDetails.remittanceFrequencys[0].exclude}">
<a4j:ajax event="click" render="remittanceFrequency" />
</h:selectBooleanCheckbox>
</div>
</div>
</rich:panel>
<!-- Suspend check box -->
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal != 1}">
<div class="grid2hidden">
<h:outputText value=" " />
</div>
</rich:panel>
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.action == 'AMEND'}">
<div class="grid3">
<div align="center">
<h:selectBooleanCheckbox
id="suspend0"
value="#{mandate.remittanceDetails.remittanceFrequencys[0].suspend}">
<a4j:ajax event="change" />
</h:selectBooleanCheckbox>
</div>
</div>
</rich:panel>
<!-- Exclude check box -->
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}">
<div class="grid2">
<div align="center">
<h:selectBooleanCheckbox
id="exclude0"
value="#{mandate.remittanceDetails.remittanceFrequencys[0].exclude}"
disabled="#{mandate.remittanceDetails.remittanceFrequencys[0].reduce}">
<a4j:ajax event="change" render="remittanceFrequency" />
</h:selectBooleanCheckbox>
</div>
</div>
</rich:panel>
<rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal != 1}">
<div class="grid2hidden">
<h:outputText value=" " />
</div>
</rich:panel>
<div class="errorRemittance">
<rich:message styleClass="errorText" for="remittanceAmount0"/>
</div>
<!-- Monthly Amount field -->
<div class="grid5">
<h:inputText
id="remittanceAmount0" size="30" maxlength="8" readOnly="true"
value="#{mandate.remittanceDetails.remittanceFrequencys[0].amount}"
disabled="#{!mandate.remittanceDetails.remittanceFrequencys[0].reduce}"
label="#{msg['remittanceDetails.amountToBeDebited']}">
<a4j:ajax event="change" render="remittanceFrequency" />
</h:inputText>
</div>
</div>
</div>
<div class="errorText" font="bold">
<rich:message styleClass="errorTextNoPadding" for="continue"/>
</div>
</div>
</div>
</a4j:outputPanel>
</fieldset>
</a4j:outputPanel>
<rich:message>
<rich:message for="remittanceFrequency" ajaxRendered="true" />
</rich:message>
</ui:repeat>
I've taken out a lot of my code here so there may be un macthed divs etc but the idea is there.
I have two problems:
- You can see that some components have change events that render other components based on id. These don't work inside the repeat
- I'm using webflow and adding messages to the message context so that the message tags can display validation messages but these don't work in the iteration either.
I have tried tr:iterator, c:forEach, a4j:repeat, tr:forEach. I'm pretty sure what I'm trying to do isn't possible the way I'm trying to do it so if anyone has experience trying to achieve similar I'd appreciate some help. I can't change the MVC frameowork I'm using but could use perhaps jQuery.