0

I have a problem with how JSF is referencing repeated elements on the page. In the following block of code I am trying to apply region specific input masks.

Issue: When there are two or more residences stored/entered, all the postal code input boxes reference the first country box, not their own country box. So if the first one is Canada (value 1013) then all the postal boxes will be in the Canada format mask. Does not matter what the second country is.

However the update="#{p:component('postalpcen')}" parts of the code correctly target the correct postal code box for refresh.

<p:outputPanel id="residp" styleClass="f100p">
    <table class="c">
        <ui:repeat value="#{modelBean.residences}" var="address" varStatus="row">
            <tr>
                <td rowspan="2" class="bclgy b w20 cw tac" style="border-top:none;">#{row.index + 1}</td>
                <td style="border-top:none;"><p:outputLabel value="Address"/><br/>
                    <table class="f100p">
                        <tr>
                            <td style="border:none;"><p:outputLabel value="Unit no." for="un"/><br/>
                                <span class="if"><p:inputText id="un" value="#{address.aptNumber}" class=""><p:ajax/></p:inputText></span></td>
                            <td style="border:none;"><p:outputLabel value="Street no." for="snum"/><br/>
                                <span class="if"><p:inputText id="snum" value="#{address.streetNumber}" class=""><p:ajax/></p:inputText></span></td>
                            <td style="border:none;"><p:outputLabel value="Street name" for="sname"/><br/>
                                <span class="if"><p:inputText id="sname" value="#{address.streetName}" class=""><p:ajax/></p:inputText></span></td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td colspan="2" style="border-top:none;">
                    <table class="f100p">
                        <tr>
                            <td style="border:none;">
                                <p:outputLabel value="Country" for="ctry"/><br/>
                                <p:autoComplete id="ctry" value="#{address.country}" completeMethod="#{Controller.countryIds}"
                                        var="id"  itemValue="#{id}" itemLabel="#{Controller.getCountryLabel(id)}" forceSelection="true" class="">
                                    <p:ajax event="itemSelect" update="#{p:component('postalpcen')}"/>
                                    <p:ajax event="change" listener="#{Controller.countryEdited(row.index)}" update=""/>
                                </p:autoComplete>
                            </td>
                            <td style="border:none;">
                                <p:outputLabel value="Postal code or equivalent" for="pc"/><br/>
                                <p:outputPanel id="postalpcen" styleClass="f100p">
                                    <span class="pr l_5"><p:message for="pc" styleClass="err"/></span>
                                    <span class="if">   
                                        <c:choose>
                                            <c:when test="#{address.country eq '1013'}"><!-- Canada -->
                                                <p:inputMask id="pc" value="#{address.postalCode}" maxlength="10" mask="a9a 9a9" class="">
                                                <p:ajax/>
                                            </p:inputMask>
                                            </c:when>
                                            <c:otherwise><!-- Not Canada -->
                                                <p:inputMask id="pc" value="#{address.postalCode}" maxlength="10"  class="">
                                                <p:ajax/>
                                            </p:inputMask>
                                            </c:otherwise>
                                        </c:choose>
                                    </span>
                                </p:outputPanel>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </ui:repeat>
    </table>
</p:outputPanel>

There is a similar question being asked, but this question deals with the value always being empty. Mine is not empty, its the wrong one.

Fering
  • 322
  • 2
  • 18
  • check https://stackoverflow.com/questions/3342984/jstl-in-jsf2-facelets-makes-sense you cannot iterate in a `ui:repeat` and use it's var in jstl but the actual duplicate is https://stackoverflow.com/questions/32390021/using-el-variable-of-cset-inside-facelets-uirepeat-tags – Kukeltje Jan 20 '20 at 20:54
  • @Kukeltje Yes, both those links provides the answer to what is going wrong in the code. As is often the case, I might not have did this code but it will be up to me to fix it. – Fering Jan 21 '20 at 15:13
  • @BalusC Could you change what question the duplicate is linked to as the ones shared by Kukeltje are actually better examples of what is going on with this code. – Fering Jan 21 '20 at 15:14

0 Answers0