Question

I have a composite component (a navigation bar) that takes a variable called ‘activeIndex’ to determine which tab is active (obviously). The nav bar is a composite component with an attribute as follows:

<!-- INTERFACE -->
<cc:interface>
    <cc:attribute name="tab"/>
</cc:interface>

<!-- IMPLEMENTATION -->
<cc:implementation>

    <pou:tabMenu activeIndex="#{cc.attrs.tab}" 
                 styleClass="margin-top-52">  

        <pou:menuitem value="Home" url="#" />  
        <pou:menuitem value="About" url="#"/> 
        <pou:menuitem value="iConsult" url="#"/> 
        <pou:menuitem value="Contact" url="#"/>  

    </pou:tabMenu> 

</cc:implementation>

So from here I can pass in the active tab using:

<!-- Composite Navigation -->
<ez:anonymous-navigation tab="2"/>

The problem is that the above code is placed in a template.xhtml and I don’t want to specify the tab value 2 in the template. Instead I need to pass this value back from the page that implements the template that in turn passes that to the above code.

Answer 1

Use <ui:param>. Here’s a kickoff example:

client.xhtml:

<ui:composition template="/WEB-INF/template.xhtml"
    xmlns="..."
>
    <ui:param name="tab" value="2" />
    ...
</ui:composition>

/WEB-INF/template.xhtml:

<ez:anonymous-navigation tab="#{tab}"/>