JSF 2 composites and binding for validation

Question

I have a problem with a JSF composite which validates internal input fields. Following code snippet works as long as only one composite is included.

<div id="#{cc.clientId}" >
  <h:panelGroup styleClass="#{not firstname.valid ? 'fmError' : ''}">
    <div class="col220">
        <h:outputLabel for="firstname" value="Vorname(n):" />
    </div>
    <div class="col220">
        <h:inputText id="firstname" styleClass="fmTxt " 
            value="#{cc.attrs.person.firstname}" binding="#{firstname}">
            <f:validateRequired />
        </h:inputText>

    </div>
  </h:panelGroup>
</div>

As you can see I use the cc.clientId to wrap the composite and having unique IDs for the components inside the composite. So it is possible to include more than one composites on a single page.

The problems starts with the validation and the need to bind the inputText component. I need this to ask the validation outcome in the panelGroup for highlighting not only the inputField but also the label.

This code is working perfectly when using only one composite on a page. When using a second one, the inputField 'firstname' is not shown anymore. I guess it has to do with the binding and its hardcoded '#{firstname}'.

Now the question: How can I create a unique identifier for the binding attribute?

I'm thankful for any hint. Thanks!

Answer 1

I suggest to create an alias with an unique ID and store it in request scope.

<div id="#{cc.clientId}">
  <ui:param name="firstname" value="#{cc.clientId}_firstname" />
  <h:panelGroup styleClass="#{not requestScope[firstname].valid ? 'error' : ''}">
    <div class="col220">
        <h:outputLabel for="firstname" value="Vorname(n):" />
    </div>
    <div class="col220">
        <h:inputText id="firstname" styleClass="fmTxt " 
            value="#{cc.attrs.value}" binding="#{requestScope[firstname]}">
            <f:validateRequired />
        </h:inputText>

    </div>
  </h:panelGroup>
</div>