Dynamic component creation

[Enrique Medina]

Hi,

I am trying to dynamically create some components inside my backing bean, but I can't get it to work right now...

Imagine I have to dynamically generate some tabs inside a PanelTabbedPane, and one data table inside each tab, so I'll explain what I am doing:

1) In my JSP I define the HtmlPanelTabbedPaneTag:

<t:panelTabbedPane bgcolor="#F8F8F8" align="center"
                binding="#{puntuacionesBean.panelTabuladores}">

and as can be seen, I bind it to my component in my backing bean (puntuacionesBean).

2) Inside my backing bean (puntuacionesBean), I declare a variable named "panelTabuladores" with type UIPanel. Then I also declare a getter and a setter for it.

3) When the page is rendered, the HtmlPanelTabbedPaneTag invokes the HtmlPanelTabbedPane component, so my "getPanelTabuladores" method is called. So:
    3.1) I check whether my "panelTabuladores" variable is null or not. If it is null, the I create myself the component, and then I create all the components that will be the children of the HtmlPanelTabbedPane (simulating tags inside tags):

        if (this.panelTabuladores == null)
        {
            this.panelTabuladores = (HtmlPanelTabbedPane) FacesUtils
                    .getApplication().createComponent(
                            HtmlPanelTabbedPane.COMPONENT_TYPE);

            UIPanel tab0 = (HtmlPanelTab) FacesUtils.getApplication()
                    .createComponent(HtmlPanelTab.COMPONENT_TYPE);
            ;
            tab0.setParent(this.panelTabuladores);
            tab0.setId("panelTab0");
            tab0.getAttributes().put("label", "Variable0");

            UIData tabla0 = (HtmlDataTable) FacesUtils.getApplication()
                    .createComponent(HtmlDataTable.COMPONENT_TYPE);
            tabla0.setId("tablaEdicionPuntuaciones0");
            tabla0.setVar("puntuacion0");
            tabla0.getAttributes().put("width", "100%");
            tabla0.getAttributes().put("cellspacing", "1");
            tabla0.getAttributes().put("cellpadding", "2");
            tabla0.getAttributes().put("renderedIfEmpty", Boolean.FALSE);
            tabla0.getAttributes().put("preserveDataModel", Boolean.FALSE);
            tabla0.setValueBinding("value", FacesUtils
                    .getValueBinding("#{puntuaciones.listasPuntuaciones[0]}"));
            tabla0.setRows(10);
            tabla0.getAttributes().put("rowClasses", "impar,par");
            tabla0.getAttributes().put("headerClass", "apptblhdr");
            tabla0.getAttributes().put("rowIndexVar", "numFila0");
            tabla0.getAttributes().put("rowOnMouseOver", "tblOver(this)");
            tabla0.getAttributes().put("rowOnMouseOut",
                    "tblOut(this, #{numFila0%2})");

            UIColumn col1 = (HtmlSimpleColumn) FacesUtils.getApplication()
                    .createComponent(HtmlSimpleColumn.COMPONENT_TYPE);
            col1.getAttributes().put("style", "text-align: center;");
            UIOutput texto1 = (HtmlOutputText) FacesUtils.getApplication()
                    .createComponent(HtmlOutputText.COMPONENT_TYPE);
            texto1.setValueBinding("value", FacesUtils
                    .getValueBinding("#{mensajes.puntuaciones_Tramos}"));
            col1.setHeader(texto1);
            UIOutput texto2 = (HtmlOutputText) FacesUtils.getApplication()
                    .createComponent(HtmlOutputText.COMPONENT_TYPE);
            texto2
                    .setValueBinding(
                            "value",
                            FacesUtils
                                    .getValueBinding("#{puntuacion0.valor.minimo} - #{puntuacion0.valor.maximo}"));
            col1.getChildren().add(texto2);

            UIColumn col2 = (HtmlSimpleColumn) FacesUtils.getApplication()
                    .createComponent(HtmlSimpleColumn.COMPONENT_TYPE);
            col2.getAttributes().put("style", "text-align: center;");
            UIInput texto3 = (HtmlInputText) FacesUtils.getApplication()
                    .createComponent(HtmlInputText.COMPONENT_TYPE);
            texto3.setValueBinding("value", FacesUtils
                    .getValueBinding("#{puntuacion0.puntuacion}"));
            col2.getChildren().add(texto3);

            tabla0.getChildren().add(col1);
            tabla0.getChildren().add(col2);

            tab0.getChildren().add(tabla0);

            this.panelTabuladores.getChildren().add(tab0);

            ....

           As can be seen, I create every subcomponent and add it to the getChildren list of the parent component.
    3.2) I return the just initialized "panelTabuladores" variables as a HtmlPanelTabbedPane component

The problem is that the tabs are visible, but the data table seems to be absolutely ignored, as it doesn't appear in the page.

However if, instead of the data table, I simply create tab with a text component inside it, then it is correctly displayed, so there must be a problem I cannot see with my data table.

Any help would be really appreciated.