Invoke ActionListener of Backing Component in Composite Component

Question

try to write a composite component that allows mutltiple text inputs. I read that it is possible to define a backing component for a composite component, so I don't have to write a renderer nor a handler. What I couldn't figure out is how to delegate actions declared in composite's xhtml to the backing component. I guess i did not yet quite understand the concept of this. Does anybody has an Idea?

I am using Tomcat 7, EL 2.2, Spring 3, Mojarra 2.1.7

This is the way i'd like to use the component:

<custom:multiInput value="#{backingBean.inputList}"/>

Where the BackingBean.java holds a list of objects:

@Component
@Scope(value="view")
public class BackingBean {
    ...
    private List<Foo> inputList;
    ....
}

The composite component multiInput.xhtml looks like this:

<cc:interface componentType="MultiInput">
    <cc:attribute name="value" required="true" type="java.util.List" />
</cc:interface>

<cc:implementation>    
    <div id="#{cc.clientId}">
        <h:dataTable value="#{cc.attrs.rows}" var="row">
            <h:column>
                <!-- here will be a selector component in order to select a foo object -->
            </h:column>
            <h:column>
               <h:commandButton value="Remove Row">
                    <f:ajax execute=":#{cc.clientId}" render=":#{cc.clientId}" listener="#{cc.removeRow(row)}" />
                </h:commandButton>
            </h:column>
            <h:column>
                <h:commandButton value="Add Row" rendered="#{cc.lastRow}">
                    <f:ajax execute=":#{cc.clientId}" render=":#{cc.clientId}" listener="#{cc.addEmptyRow()}" />
                </h:commandButton>
            </h:column>
        </h:dataTable>
    </div>    
</cc:implementation>

And here the backing component MultiInput.java:

@FacesComponent(value="MultiInput")
public class MultiInput extends UIInput implements NamingContainer, Serializable{

    ...

    @Override
    public String getFamily() {
        return "javax.faces.NamingContainer";
    }

    @Override
    public void encodeBegin(FacesContext context) throws IOException {
        initRowsFromValueAttribute();
        super.encodeBegin(context);
    }

    public void removeRow(MultiInputRow row) {
        // why is this method is never reached when clicking remove button?
    }

    public void addEmptyRow() {
        // why is this method is never reached when clicking add button?
    }

    public ListDataModel<MultiSelectRow> getRows() {
        return (ListDataModel<MultiSelectRow>) getStateHelper().eval(PropertyKeys.rows, null);
    }

    private void setRows(ListDataModel<MultiSelectRow> rows) {
        getStateHelper().put(PropertyKeys.rows, rows);
    }

    ...
}

Now - removeRow and addEmptyRow is never called on MultiInput. An ajax request is triggered but it gets lost somewhere. Why?

Is there a rendered attribute on the composite or any of its parents? If so, are you 100% that it evaluates true during the form submit? See also stackoverflow.com/questions/2118656/… You've by the way quite some red herrings in the code. Please be careful when simplifying/renaming. — BalusC
thx @BalusC, i updated the sample so it has less 'red herrings' (hopefully). yes, I verified that all parent components rendered attributes are evaluated to true. but what makes me wonder is point 4 in stackoverflow.com/questions/2118656/…. it seems the backing component is not preserved. each time i click the remove or add button CompositeComponentTagHandler.createComponent will create a new instance of the backing component MultiInput. but why? — fischermatte
I've created components like that before and they works fine. I copypasted your exact code (I only replaced Foo and MultiSelectRow by Object for simplicity) and it works fine. Your concrete problem is caused elsewhere which isn't shown in the code posted so far. Maybe a nested form. Maybe a rendered attribute which evaluated false. Who knows. The only difference is that I don't use Spring and thus just used standard JSF annotations on the bean. — BalusC

claudegex claudegex · Accepted Answer · 2012-03-28T19:33:12

I think the method signature for ajax listener methods should include the AjaxBehaviorEvent (unverified):

public void addEmptyRow(AjaxBehaviorEvent event) { ... }

and the f:ajax tag should just look like (without parentheses):

<f:ajax execute=":#{cc.clientId}" render=":#{cc.clientId}" listener="#{cc.addEmptyRow}" />

Invoke ActionListener of Backing Component in Composite Component

3 Answers