title: Invoke ActionListener of Backing Component in Composite Component
body: <p>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?</p>
  
  <p>I am using Tomcat 7, EL 2.2, Spring 3, Mojarra 2.1.7</p>
  
  <p>This is the way i'd like to use the component:</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;custom:multiInput value="#{backingBean.inputList}"/&gt;
  </code></pre>
  
  <p>Where the <strong>BackingBean.java</strong> holds a list of objects:</p>
  
  <pre class="lang-java prettyprint-override"><code>@Component
  @Scope(value="view")
  public class BackingBean {
      ...
      private List&lt;Foo&gt; inputList;
      ....
  }
  </code></pre>
  
  <p>The composite component <strong>multiInput.xhtml</strong> looks like this:</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;cc:interface componentType="MultiInput"&gt;
      &lt;cc:attribute name="value" required="true" type="java.util.List" /&gt;
  &lt;/cc:interface&gt;
  
  &lt;cc:implementation&gt;    
      &lt;div id="#{cc.clientId}"&gt;
          &lt;h:dataTable value="#{cc.attrs.rows}" var="row"&gt;
              &lt;h:column&gt;
                  &lt;!-- here will be a selector component in order to select a foo object --&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                 &lt;h:commandButton value="Remove Row"&gt;
                      &lt;f:ajax execute=":#{cc.clientId}" render=":#{cc.clientId}" listener="#{cc.removeRow(row)}" /&gt;
                  &lt;/h:commandButton&gt;
              &lt;/h:column&gt;
              &lt;h:column&gt;
                  &lt;h:commandButton value="Add Row" rendered="#{cc.lastRow}"&gt;
                      &lt;f:ajax execute=":#{cc.clientId}" render=":#{cc.clientId}" listener="#{cc.addEmptyRow()}" /&gt;
                  &lt;/h:commandButton&gt;
              &lt;/h:column&gt;
          &lt;/h:dataTable&gt;
      &lt;/div&gt;    
  &lt;/cc:implementation&gt;
  </code></pre>
  
  <p>And here the backing component <strong>MultiInput.java</strong>:</p>
  
  <pre class="lang-java prettyprint-override"><code>@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&lt;MultiSelectRow&gt; getRows() {
          return (ListDataModel&lt;MultiSelectRow&gt;) getStateHelper().eval(PropertyKeys.rows, null);
      }
  
      private void setRows(ListDataModel&lt;MultiSelectRow&gt; rows) {
          getStateHelper().put(PropertyKeys.rows, rows);
      }
  
      ...
  }
  </code></pre>
  
  <p>Now - <code>removeRow</code> and <code>addEmptyRow</code> is never called on MultiInput. An ajax request is triggered but it gets lost somewhere. Why?</p>