Question

Lets say clicking a button A on a modalPanel does actionA:

<a4j:commandLink styleClass="abc"
     immediate="true"
     action="actionA"
     oncomplete="#{rich:component('modalPanel')}.hide(); Event.stop(event); return false;">
</a4j:commandLink>

Now I have another button, button B which needs to mimic the functionality of button A. Here is the code for button B:

<h:outputLink value="javascript:void(0)" class="btn-image close">
<span><h:outputText value="Close"></h:outputText></span>
<rich:componentControl for="#{(empty modalId) ? defaultModalId : modalId}" operation="hide" event="onclick"/>
</h:outputLink>

In the rich:componentControl’s ‘for’ attribute, can I search for button A and call actionA?

Any help would be appreciated!!

Answer 1

To the point, you would need to know the ID of the generated HTML <a> element of the <a4j:commandLink> component in question. If it’s dynamic/autogenerated, you’d like to let JSF generate a fixed client ID by giving the component and the parent UINamingContainer components (like <h:form>) a fixed ID

<h:form id="myform">
    <a4j:commandLink id="mylink" ... />
    ...
</h:form>

In above example, the ID will become myform:mylink. To invoke a click event by JS, you could then just do

<h:outputLink onclick="document.getElementById('myform:mylink').click()">

If you’re using RichFaces4, you could use #{rich:element()} to locate the element by the server side ID so that you don’t need to know the form’s ID

<h:outputLink onclick="#{rich:element('mylink')}.click()">