Binding to Declarative Components

Question

I've created a small sample project highlight a problem I'm having. I have a declarative component [dummDCdef.jspx] with a managed bean (backing bean scope) [DummyDCdef.java]. After deploying the component to and importing the .jar in another project (call it demo), I am attempting to bind to the declarative component. In the demo project I have a managed bean (pageFlow scope) [demoBean.java] that handles the declarative component binding logic. The declarative component consists of an outputText, with a default value set, and inputText, and a button. Upon button action the outputText value is copied to the inputText. The demo project contains a page with the declarative component, an outputText and a button. Upon button action I am attempting to take the value from the inputText in the declarative component, and copy it to the outputText in the demo page. The "big picture" goal is to be able to get values FROM a declarative component and store them on a managed bean in a containing project.
The problem is, when attempting to bind to the component in the containing project, the instance of the declarative component is not accessible in the backing bean, i.e. something like componentBinding.getValue() does not work, where as in a regular component like inputText, inputTextBinding.getValue() works as one would imagine.
Search on "Epic Fail" to see where I'm failing.
JDevloper Studio Edition Version 11.1.1.6.0
JDEVADF_11.1.1.6.0_GENERIC_111205.1733.6192.1
DECLARATIVE COMPONENT PROJECT:
dummyDCdef.jspx (component definition):
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <af:componentDef var="attrs" componentVar="component">
    <af:decorativeBox id="dc_db1">
      <f:facet name="center">
        <af:panelGroupLayout id="dc_pgl1">
          <af:outputText value="Copy This Text" id="dc_ot1"
                         binding="#{backingBeanScope.DCdefBean.outputTextBinding}"/>
          <af:inputText label="Label 1" id="dc_it1"
                        binding="#{backingBeanScope.DCdefBean.inputTextBinding}"/>
          <af:commandButton text="Copy Text" id="dc_cb1"
                            action="#{backingBeanScope.DCdefBean.buttonAction}"/>
        </af:panelGroupLayout>
      </f:facet>
    </af:decorativeBox>
    <af:xmlContent>
      <component xmlns="http://xmlns.oracle.com/adf/faces/rich/component">
        <display-name>dummyDCdef</display-name>
        <component-class>component.DummyDCdef</component-class>
        <attribute>
          <attribute-name>Label</attribute-name>
          <attribute-class>java.lang.String</attribute-class>
        </attribute>
        <component-extension>
          <component-tag-namespace>component</component-tag-namespace>
          <component-taglib-uri>/dummyDC</component-taglib-uri>
        </component-extension>
      </component>
    </af:xmlContent>
  </af:componentDef>
</jsp:root>DummDCdef.java (backingBean scoped):
package component;
import oracle.adf.view.rich.component.rich.fragment.RichDeclarativeComponent;
import oracle.adf.view.rich.component.rich.input.RichInputText;
import oracle.adf.view.rich.component.rich.output.RichOutputText;
public class DummyDCdef extends RichDeclarativeComponent {
    private RichInputText inputTextBinding;
    private RichOutputText outputTextBinding;
    public DummyDCdef() {
    public void setInputTextBinding(RichInputText inputTextBinding) {
        this.inputTextBinding = inputTextBinding;
    public RichInputText getInputTextBinding() { 
        return inputTextBinding;
    public void setOutputTextBinding(RichOutputText outputTextBinding) {
        this.outputTextBinding = outputTextBinding;
    public RichOutputText getOutputTextBinding() {
        return outputTextBinding;
    public String buttonAction() {
        inputTextBinding.setValue(outputTextBinding.getValue().toString());
        return null;
Demo Project:
demo.jspx:
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich"         
          xmlns:sdc="/dummyDC">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <f:view>
    <af:document id="d1">
      <af:form id="f1">
        <sdc:dummyDCdef id="ddc1" binding="#{pageFlowScope.demo.dcBinding}"/>
        <af:outputText value="Default Text" id="ot1"/>
        <af:commandButton text="commandButton 1" id="cb1"
                          action="#{pageFlowScope.demo.copyFromDC}"/>
      </af:form>
    </af:document>
  </f:view>
</jsp:root>demoBean.java (pageFlow scope):
package ddcd;
import component.DummyDCdef;
public class demoBean {
    private DummyDCdef dcBinding;
    public demoBean() {
        super();
    public void setDcBinding(DummyDCdef dcBinding) {
        this.dcBinding = dcBinding;
    public DummyDCdef getDcBinding() {
        return dcBinding;
    public String copyFromDC() {       
        try {
            System.out.println(dcBinding.getInputTextBinding().getValue().toString());
        } catch (NullPointerException e) {
            //e.PrintStackTrace();
            System.out.println("Epic Fail (1)");
        return null;
}Edited by: 977647 on Dec 21, 2012 11:07 AM
Edited by: 977647 on Jan 2, 2013 10:28 AM

Answer 1

Sascha Herrmann wrote:
The instance of that class is already part of the JSF component tree. JSF creates it for you when it builds the tree. No need to have an additional bean. You can work with it like you would with RichOutputText or RichInputText.
In your component you have:
<af:componentDef var="attrs" componentVar="component">
That means that with EL "#{attrs}" you can access (from within your component!) in EL any attribute that you might specify in the decl. component. "#{component}" gives you access (from within your component!) in EL to the instance of the component class. Being an instance of DummyDCdef in your case.That was the key. In the component project I removed the backingbean binding for DummyDCdef. I also changed <af:componentDef var="attrs" componentVar="component"> to <af:componentDef var="attrs" componentVar="*dummyComponent*"> for clarity. The confusing part about the bindings in dummyDCdef.jspx is that when you click "binding -> edit" for the outputText for example, the selection for the binding makes it seem as if a managed bean is required - it explicitly asks you to choose a managed bean from a drop down. Instead of binding in this manner however, if you just write in the EL binding="#{ *dummyComponent*.outputTextBinding}" the binding will be made correctly, even though the red squiggly lines show up suggesting there is a problem.
If you're new to this like me, at this point you should be asking "that's cool, but WHERE do you define the class for the component logic-that is-where is the class "dummyComponent" refers to?" In the declarative component definition .jspx page inside of the <af:xmlContent> tags there is a <component-class>. So for the code in my original post, the only differences would be to remove the managed bean in backingbeanscope from adfc-config and make a few tweaks in dummyDCdef.jspx.
dummyDCdef.jspx:
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <af:componentDef var="attrs" componentVar="dummyComponent">
    <af:decorativeBox id="dc_db1">
      <f:facet name="center">
        <af:panelGroupLayout id="dc_pgl1">
          <af:outputText value="Copy This Text" id="dc_ot1"         
                         binding="#{dummyComponent.outputTextBinding}"/>
          <af:inputText label="Label 1" id="dc_it1"
                        binding="#{dummyComponent.inputTextBinding}"/>
          <af:commandButton text="Copy Text" id="dc_cb1"
                            action="#{dummyComponent.buttonAction}"/>
        </af:panelGroupLayout>
      </f:facet>
    </af:decorativeBox>
    <af:xmlContent>
      <component xmlns="http://xmlns.oracle.com/adf/faces/rich/component">
        <display-name>dummyDCdef</display-name>
        <component-class>component.DummyDCdef</component-class>
        <attribute>
          <attribute-name>Label</attribute-name>
          <attribute-class>java.lang.String</attribute-class>
        </attribute>
        <component-extension>
          <component-tag-namespace>component</component-tag-namespace>
          <component-taglib-uri>/dummyDC</component-taglib-uri>
        </component-extension>
      </component>
    </af:xmlContent>
  </af:componentDef>
</jsp:root>NOTE: <component-class>component.DummyDCdef</component-class>
"component" here is in no way a key path/reserved term. I changed <af:componentDef var="attrs" componentVar="*dummyComponent*"> specifically to avoid confusion here. component.DummyDCdef is literally the class path where I execute component logic.
Edited by: 977647 on Jan 11, 2013 11:19 AM