Question

I defined a custom component and tried to use binding as the following:

<ui:composition ...>
    <div>
        <f:subview>
            <a4j:outputPanel>
                <h:commandButton id="t1" value="test!" />
                ...
            </a4j:outputPanel>
        </f:subview>
    </div>
</ui:composition>

This component works properly until I added a binding attribute like this:

<h:commandButton id="t1" binding="#{foo}" value="test!" onclick="alert('I am #{id:cid(foo)}'); return false;" />

This component doesn’t show up, and I can’t find the corresponding piece of code for this button.

Anyone knows a fix?

Answer 1

yes, it is used multiple times

There’s the cause. The binding should refer an unique reference for the component. Right now you’ve physically multiple components referring to one and same reference.

I’m not sure what’s the concrete functional requirement is, but more than often this approach is unnecessary when you’re already inside the JavaScript context. The particular example can then also just be solved as follows:

<h:commandButton id="t1" value="test!" onclick="alert('I am ' + id); return false;" />

The ID of the generated HTML element itself is namely exactly the same as JSF component client ID.