2

I have a requirement to create a panel dynamically using jsf 2.0 custom components. The controls within the panel will be dynamically read from an xml and rendered on the selection of the corresponding object (Eg : If Person is selected, I should render a panel which will have controls related to person like : Person age field(inputtext), Person DOB(calendar) and so on).

I am trying to render it from the component class which extends UIComponentBase.

ResponseWriter writer = Util.getResponseWriter(context);
//start the <table> tag
writer.startElement(Constants.STR_TABLE, this);

//start the <tr> tag
writer.startElement(Constants.STR_TR, this);

//start the <td> tag
writer.startElement(Constants.STR_TD, this);

//encode the button 1 component inside this <td>
encodeAllComponent(context, getMyPrimePanel());

// end the <td> tag
writer.endElement(Constants.STR_TD);

//end the <tr> tag
writer.endElement(Constants.STR_TR);


//end the <table> tag
writer.endElement(Constants.STR_TABLE);

  //private variable to render a panel
  private Panel myPrimePanel;

  /**
  * @return the myPrimePanel
  */
  public Panel getMyPrimePanel() {
        System.out.println("inside the panel get method------");
        if (myPrimePanel.getChildCount() <= 1) {
              System.out.println("inside the panel creation function");
              InputText input = new InputText();
              myPrimePanel.getChildren().add(input);

        }
        System.out.println("inside the panel get method-------------");
        return myPrimePanel;
  }

  /**
  * @param myPrimePanel the myPrimePanel to set
  */
  public void setMyPrimePanel(Panel myPrimePanel) {
        System.out.println("inside the panel get method-------------");
        //initialize the button 1 component
        this.myPrimePanel = myPrimePanel;
  }

I have done this way. But I am getting a null pointer exception. How can the panel with the defined controls be rendered dynamically?

This is what I'm getting -

====Will Start Rendering==== inside the panel get method------ Sep 7, 2011 10:01:42 AM com.sun.faces.context.PartialViewContextImpl$PhaseAwareVisitCallback visit SEVERE: java.lang.NullPointerException

2
  • 2
    Check the stack trace of the exception (in server log). There must be a line number for the NPE, such as "NullPointerException at line xy". Tell us which line it is in your code. This would make it easier for us to help you.
    – Matt Handy
    Sep 7, 2011 at 7:28
  • Thanks for the reply. But it is not showing any line number. Sep 7, 2011 at 9:12

1 Answer 1

2

myPrimePanel is null. You would need to assign an instance of it for it not to be null.

However, I think you are going about this task the wrong way. You should not be adding components to the tree in the Render phase. Presumably, you want to read, validate and that input data into the model some time.

Emit your start elements in encodeBegin. Emit your end elements in encodeEnd. Do not override encodeChildren and ensure getRendersChildren returns false (this is the default).

Use the binding attribute to provision the dynamic component during the Restore View phase. Add a request scope managed bean with a property of type UIComponent and bind it to the element in your view using EL. In the getter, if the property is null, create a new instance of your custom control and add any children.


Consider this view:

<h:form>
  <h:panelGroup id="myPanel" binding="#{componentMakerBean.panel}" />
  <h:commandButton value="go" action="#{componentMakerBean.dumpValuesAction}" />
</h:form>

The panel is created and populated in a bean:

/** Request scope bean defined in faces-config.xml */
public class ComponentMakerBean {
  private UIPanel panel;

  public UIPanel getPanel() {
    if(panel == null) {
      panel = new HtmlPanelGroup();
      for(int i=0; i<3; i++) {
        panel.getChildren().add(new HtmlInputText());
      }
    }
    return panel;
  }

  public void setPanel(UIPanel panel) { this.panel = panel; }

  public String dumpValuesAction() {
    for(Object kid : panel.getChildren()) {
      if(kid instanceof ValueHolder) {
        ValueHolder valueHolder = (ValueHolder) kid;
        System.out.println(valueHolder.getValue());
      }
    }
    return null; //no navigation
  }
}

At runtime, this will emit three editable text fields whose values will be printed to the log when the button is clicked.

This code was tested in a JSP using Java 5 & JSF 1.1.

9
  • Thanks for the reply. Can you tell me more clearly as to how to create? I'm very new to custom components. Should I create another class which extends the UIComponentTag class? And in setProperties I should do valueBinding using the EL is it? Can u give a sample snippet for the same? Sep 7, 2011 at 9:11
  • @Deepika - you do not need any additional tags using the approach I outlined; you just need to make use of the component binding feature. See the JSF specification for details on behaviour. I have added some sample code.
    – McDowell
    Sep 7, 2011 at 10:41
  • Ya this is right. But Custom component is not used here is it. But my requirement is to use custom component. :( I was able to render the controls in the way you have specified but I should do the same using custom components. And in jsf 2.0 it is not allowing me to include a tld file as it allows only facelets. (.xhtml) pages Sep 7, 2011 at 10:55
  • @Deepika - I thought it was obvious, but use the binding attribute with your custom control. How tags are defined in Facelets is detailed in the JSF specification. Facelets has its own tag library descriptor format - see this example
    – McDowell
    Sep 7, 2011 at 11:05
  • 1
    @Deepika - I do not know what your error is; the posted code works as is on Mojarra 2.x (running on Glassfish 3.1) and MyFaces 2.x (running on Jetty 7)
    – McDowell
    Sep 15, 2011 at 18:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.