title: JSF ui:repeat with render
body: <p>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.</p>
  
  <pre><code>&lt;!-- print multiple mandates --&gt;
          &lt;ui:repeat id="mandates" var="mandate" value="#{taxheadDirectDebit.mandates}"&gt;
  
  
  
  
          &lt;a4j:region id="remittanceDetailsSection"
              rendered="#{(taxheadDirectDebit.accountFinancialInfo.registration.type != 'PREM') or (taxheadDirectDebit.accountFinancialInfo.registration.type != 'VAT')}"&gt;
  
  
              &lt;!-- Remittance Details --&gt;
              &lt;fieldset&gt;&lt;legend class="sub"&gt; &lt;h:outputText
                  value="#{msg['remittanceDetails.title']}" /&gt; &lt;/legend&gt; 
  
              &lt;!-- Estimated Liability --&gt;
              &lt;div class="field"&gt;
              &lt;div class="label"&gt;&lt;label for="allocatedAmount"&gt;&lt;h:outputText
                  for="estimatedLiability"
                  value="#{msg['remittanceDetails.estimatedLiability']}" /&gt; &lt;/label&gt;&lt;span
                  class="requiredFlag"&gt;*&lt;/span&gt;&lt;/div&gt;
              &lt;div class="error"&gt;
                  &lt;rich:message styleClass="errorText" for="estimatedLiability" /&gt;
              &lt;/div&gt;
              &lt;div class="input"&gt;
                  &lt;h:inputText id="estimatedLiability" size="30"
                  maxlength="11" label="#{msg['registerContractPage1.subTaxNumber']}"
                  value="#{taxheadDirectDebit.estimatedLiability}"&gt;
                  &lt;a4j:ajax event="change" render="remittanceFrequency" /&gt;
                  &lt;/h:inputText&gt;
              &lt;/div&gt;
  
              &lt;br class="clear" /&gt;
  
              &lt;/div&gt;
  
              &lt;!-- Is Seasonal --&gt;
              &lt;div class="field"&gt;
              &lt;div class="label"&gt;&lt;label for="isSeasonal"&gt; &lt;h:outputText
                  for="isSeasonal"
                  value="#{msg['remittanceDetails.isTheNatureSeasonal']}" /&gt; &lt;/label&gt;&lt;span
                  class="requiredFlag"&gt;*&lt;/span&gt;&lt;/div&gt;
              &lt;div class="error"&gt;&lt;rich:message styleClass="errorText"
                  for="isSeasonal" /&gt;&lt;/div&gt;
              &lt;div class="input"&gt;&lt;h:selectOneRadio id="isSeasonal"
                  label="#{msg['remittanceDetails.isTheNatureSeasonal']}"
                  value="#{taxheadDirectDebit.isSeasonal}"
                  styleClass="radioLabelTop"&gt;
                  &lt;ddo:twoOptionSelection /&gt;
              &lt;a4j:ajax event="click" render="remittanceFrequency" /&gt;
              &lt;/h:selectOneRadio&gt;&lt;/div&gt;
  
              &lt;br class="clear" /&gt;
  
              &lt;/div&gt;
  
              &lt;/fieldset&gt;
  
          &lt;/a4j:region&gt; 
  
          &lt;!-- Remittance Frequency --&gt;
          &lt;a4j:outputPanel id="remittanceFrequency"&gt;
  
          &lt;div class="field"&gt;
              &lt;div class="label"&gt;&lt;label for="allocatedAmount"&gt;&lt;h:outputText
                  for="estimatedLiability"
                  value="#{msg['remittanceDetails.estimatedLiability']}" /&gt; &lt;/label&gt;&lt;span
                  class="requiredFlag"&gt;*&lt;/span&gt;&lt;/div&gt;
              &lt;div class="error"&gt;
                  &lt;rich:message styleClass="errorText" for="estimatedLiability" /&gt;
              &lt;/div&gt;
              &lt;div class="input"&gt;
                  &lt;h:inputText id="estimatedLiability" size="30"
                  maxlength="11" label="#{msg['registerContractPage1.subTaxNumber']}"
                  value="#{taxheadDirectDebit.estimatedLiability}"&gt;
                  &lt;a4j:ajax event="change" render=":remittanceDetails:mandates:remittanceFrequency" /&gt;
                  &lt;/h:inputText&gt;
              &lt;/div&gt;
  
              &lt;br class="clear" /&gt;
  
              &lt;/div&gt;
  
              &lt;fieldset&gt;&lt;legend class="sub"&gt; &lt;h:outputText
                  value="#{msg['remittanceDetails.frequency']}" /&gt; &lt;/legend&gt; 
  
              &lt;!-- Amount to be Debited --&gt;
              &lt;div class="field"&gt;
              &lt;div class="label"&gt;&lt;label for="amountEachMonth"&gt;&lt;h:outputText
                  for="amountEachMonth"
                  value="#{msg['remittanceDetails.amountToBeDebited']}" /&gt; &lt;/label&gt;&lt;/div&gt;
              &lt;div class="error"&gt;&lt;rich:message styleClass="errorText"
                  for="amountEachMonth" /&gt;&lt;/div&gt;
              &lt;div class="input"&gt;&lt;h:inputText id="amountEachMonth" size="30" readOnly="true" 
                  maxlength="8" label="#{msg['remittanceDetails.amountToBeDebited']}"
                  value="#{mandate.remittanceDetails.amountEachMonth}"&gt;
                  &lt;a4j:ajax event="change" render="remittanceFrequencyNoDebitedEachMonth"/&gt;
              &lt;/h:inputText&gt;&lt;/div&gt;
              &lt;br class="clear" /&gt;
              &lt;/div&gt;
  
              &lt;a4j:outputPanel id="remittanceFrequencyNoDebitedEachMonth"&gt;
              &lt;!-- Months --&gt;
              &lt;div class="field"&gt;
                  &lt;div class="grid1"&gt;&lt;h:outputText
                      value="&amp;#160;" /&gt;&amp;#160;
                  &lt;/div&gt;
                  &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}"&gt;
                      &lt;div class="grid2"&gt;&lt;div align="center"&gt;
                          &lt;h:outputText value="#{msg['reviewDetails.reduce']}"/&gt;&lt;div align="center"&gt;&lt;/div&gt;
                      &lt;/div&gt;&lt;/div&gt;
                  &lt;/rich:panel&gt;
                  &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.action == 'AMEND'}"&gt;
                      &lt;div class="grid3"&gt;
                          &lt;div align="center"&gt;
                              &lt;h:outputText value="#{msg['reviewDetails.suspend']}"/&gt;&lt;div align="center"&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/rich:panel&gt;
                  &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}"&gt;
                      &lt;div class="grid2"&gt;
                          &lt;div align="center"&gt;
                              &lt;h:outputText value="#{msg['reviewDetails.exclude']}"/&gt;&lt;div align="center"&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/rich:panel&gt;
              &lt;br class="clear" /&gt;
  
              &lt;div class="floatleft"&gt;
  
                      &lt;div class="row3"&gt;
                          &lt;div class="row1"&gt;
  
                          &lt;!-- January --&gt;
                              &lt;!-- Months Column --&gt;
                              &lt;div class="grid1"&gt;
                                  &lt;label&gt;
                                      &lt;h:outputText readOnly="true" disabled="true" size="4" value="#{msg['calendar.month.0']}" /&gt;
                                  &lt;/label&gt;
                              &lt;/div&gt;
                              &lt;!-- Reduce check box --&gt; 
                              &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}"&gt;
                                  &lt;div class="grid2"&gt;
                                      &lt;div align="center"&gt;
                                          &lt;h:selectBooleanCheckbox 
                                              id="reduce12" 
                                              value="#{mandate.remittanceDetails.remittanceFrequencys[0].reduce}" 
                                              disabled="#{mandate.remittanceDetails.remittanceFrequencys[0].exclude}"&gt;
                                              &lt;a4j:ajax event="click" render="remittanceFrequency" /&gt;
                                          &lt;/h:selectBooleanCheckbox&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/rich:panel&gt;
                              &lt;!-- Suspend check box --&gt; 
                              &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal != 1}"&gt;
                                  &lt;div class="grid2hidden"&gt;
                                      &lt;h:outputText value="&amp;#160;" /&gt;
                                  &lt;/div&gt;
                              &lt;/rich:panel&gt;
                              &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.action == 'AMEND'}"&gt;
                                  &lt;div class="grid3"&gt;
                                      &lt;div align="center"&gt;
                                      &lt;h:selectBooleanCheckbox 
                                          id="suspend0" 
                                          value="#{mandate.remittanceDetails.remittanceFrequencys[0].suspend}"&gt;
                                          &lt;a4j:ajax event="change" /&gt;
                                      &lt;/h:selectBooleanCheckbox&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/rich:panel&gt;
                              &lt;!-- Exclude check box --&gt; 
                              &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal == 1}"&gt;
                                  &lt;div class="grid2"&gt;
                                      &lt;div align="center"&gt;
                                      &lt;h:selectBooleanCheckbox 
                                          id="exclude0" 
                                          value="#{mandate.remittanceDetails.remittanceFrequencys[0].exclude}" 
                                          disabled="#{mandate.remittanceDetails.remittanceFrequencys[0].reduce}"&gt;
                                          &lt;a4j:ajax event="change" render="remittanceFrequency" /&gt;
                                      &lt;/h:selectBooleanCheckbox&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/rich:panel&gt;
                              &lt;rich:panel styleClass="ddo-panel" rendered="#{taxheadDirectDebit.isSeasonal != 1}"&gt;
                                  &lt;div class="grid2hidden"&gt;
                                      &lt;h:outputText value="&amp;#160;" /&gt;
                                  &lt;/div&gt;
                              &lt;/rich:panel&gt;
                              &lt;div class="errorRemittance"&gt;
                                  &lt;rich:message styleClass="errorText" for="remittanceAmount0"/&gt;
                              &lt;/div&gt;
                              &lt;!-- Monthly Amount field --&gt; 
                              &lt;div class="grid5"&gt;
                                  &lt;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']}"&gt;
                                      &lt;a4j:ajax event="change" render="remittanceFrequency" /&gt;
                                  &lt;/h:inputText&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
  
                  &lt;div class="errorText" font="bold"&gt;
                      &lt;rich:message styleClass="errorTextNoPadding" for="continue"/&gt;
                  &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;/div&gt;
                  &lt;/a4j:outputPanel&gt;
                  &lt;/fieldset&gt;
              &lt;/a4j:outputPanel&gt;
  
              &lt;rich:message&gt;
                  &lt;rich:message for="remittanceFrequency" ajaxRendered="true" /&gt;
              &lt;/rich:message&gt;
  
          &lt;/ui:repeat&gt;
  </code></pre>
  
  <p>I've taken out a lot of my code here so there may be un macthed divs etc but the idea is there. </p>
  
  <p>I have two problems:</p>
  
  <ul>
  <li>You can see that some components have change events that render other components based on id. These don't work inside the repeat</li>
  <li>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.</li>
  </ul>
  
  <p>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.</p>