Jsf 动态创建的面板在XHTML上显示，但在getViewRoot上缺少

面板被创建并添加到xhtml右侧，但当我使用findComponent-formBotones-wizardEventContainer.getChildren获得它时，结果为null，因为它的容器获得了1个children id=诱惑extidlayer，而真正的html源显示了几个子对象

我尝试了visitTree的解决方案，但是vars target和panel是相同的，wizarEventContainer，并且只隐藏了1个子输入

HtmlPanelGroup panel=(HtmlPanelGroup)FacesContextWrapper.getCurrentInstance().getViewRoot().findComponent("formBotones-wizardEventContainer");

    panel.visitTree(VisitContext.createVisitContext(FacesContext.getCurrentInstance()),new VisitCallback() {

        @Override
        public VisitResult visit(VisitContext context, UIComponent target) {
             if (target instanceof HtmlPanelGroup) {
                 HtmlPanelGroup layer = (HtmlPanelGroup) target;
                    System.out.println("id: " + layer.getId()); //wizardEventContainer                  // Collect them in an arraylist orso.
                }

                return VisitResult.ACCEPT;
        }
    });

主xhtml代码

将图层添加到容器代码

这里我得到了容器wizardEventContainer，并添加了保存在tempObjs var上的每个面板

由于getViewRoot只返回写在xhtml文件中的元素，我决定将动态组件保存在映射中，当我将这个可拖动组件放置在正确的站点时，我通过托管bean属性传递css样式和其他属性，因此，每次在xhtml上添加一个新面板时，我都会创建一个新的动态组件，并设置新的属性，然后替换保存在映射中的旧动态组件

这不是一种优雅的方式，但目前对我来说效果很好

    public void saveTextLayer(){
    logger.entry("EventProvider.saveTextLayer()");

    List<UIComponent> list=null;

    if(tempObjs.containsValue("text"))
         list=getKeysByValue(tempObjs,"text");

    for (UIComponent c:list){
        if (c instanceof HtmlPanelGroup){
            HtmlPanelGroup panel=(HtmlPanelGroup)c;

            if(panel.getId().equals(getTempTextIdLayer())){
                panel.setStyle(getTempCSS());
                if(panel.getChildren().get(0) instanceof HtmlOutputText){
                    ((HtmlOutputText)panel.getChildren().get(0)).setValue(getTempHTML());
                }

                //Adding delete layer
                Application app=FacesContextWrapper.getCurrentInstance().getApplication();

                HtmlPanelGroup deleteLayer=(HtmlPanelGroup)app.createComponent(HtmlPanelGroup.COMPONENT_TYPE);
                    deleteLayer.setId("delete_" + panel.getId());
                    deleteLayer.setStyle("display:inline-block;width:5px;height:5px;background:white;");
                    deleteLayer.setOnclick("deleteLayer($(this));");
                panel.getChildren().add(0,deleteLayer);

                //Replacing UIComponent
                tempObjs.remove(c);
                tempObjs.put(panel, "text");

                updateViewRoot();

                //Deleting temp vars
                setTempCSS("");
                setTempTextIdLayer("");
                setTempHTML("");
            }
        }
    }

---

添加面板的代码在哪里？它在什么时候执行？@kolossus我用创建和添加面板的方法编辑了这个问题。此方法从按钮的actionListener调用。

<form id="formBotones">
    <input type="hidden" value="formBotones" name="formBotones">

    <div class="wizardEventContainer" id="formBotones-wizardEventContainer">
        <div data-widget="widget_formBotones_text_11_0" id="formBotones-text_11_0">

            <div class="ui-panel-content ui-widget-content" id="formBotones-text_11_0_content">
                <span id="formBotones-editor_text_11_0">Dynamic text</span>
            </div>

            <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
            <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>

        </div>

        <input type="hidden" value="text_11_0" name="formBotones-tempTextIdLayer" id="formBotones-tempTextIdLayer">
    </div>

    <input type="hidden" value="e5s4" id="javax.faces.ViewState" name="javax.faces.ViewState">
</form>

    public void createTextLayer() throws IOException{
    logger.entry("EventProvider.createTextLayer()");

    Application app=FacesContextWrapper.getCurrentInstance().getApplication();
    UIComponent parent=FacesContextWrapper.getCurrentInstance().getViewRoot().findComponent("formBotones-wizardEventContainer");
    CommandButton textBtn=(CommandButton)FacesContextWrapper.getCurrentInstance().getViewRoot().findComponent("formControl-textLayerBtn");

    String finalId=null;

    if(tempObjs!=null && tempObjs.size()>0 && tempObjs.containsValue("text")){
        finalId="text_" + space.getIdSpace() + "_" + createFinalIndex("text");
    }
    else{
        finalId="text_" + space.getIdSpace() + "_" + spaceBo.getDao().countSectionPages(space.getIdSpace(),4);
    }


    if(parent!=null){


        HtmlPanelGroup panel=(HtmlPanelGroup)app.createComponent(HtmlPanelGroup.COMPONENT_TYPE);
            panel.setId(finalId);
            panel.setStyleClass(panel.getId());
            panel.setStyle("display:inline-block;min-width:100px;min-height:100px;background:red;overflow:hidden;");
            setTempTextIdLayer(finalId);


        HtmlOutputText text=(HtmlOutputText) app.createComponent(HtmlOutputText.COMPONENT_TYPE);
            text.setId("editor_" + panel.getId());

        panel.getChildren().add(text);


        Resizable resizable=(Resizable)app.createComponent(Resizable.COMPONENT_TYPE);

            resizable.setFor(panel.getId());
            resizable.setMaxWidth(new Integer(800));
            resizable.setMaxHeight(new Integer(600));
            resizable.setMinWidth(new Integer(50));
            resizable.setMinHeight(new Integer(50));
            resizable.setContainment(false);
            resizable.setFor(panel.getId());

            panel.getChildren().add(resizable);         


        Draggable drag=(Draggable)app.createComponent(Draggable.COMPONENT_TYPE);

            drag.setFor(panel.getId());
            drag.setOpacity(new Double(0.6));
            drag.setContainment(new String("parent"));
            drag.setSnap(true);
            drag.setSnapMode(new String("outer"));
            drag.setSnapTolerance(new Integer(5));
            drag.setFor(panel.getId());

            panel.getChildren().add(drag);

        tempObjs.put(panel,"text");
    }

    updateViewRoot();

    //Disabling text button
    textBtn.setDisabled(true);
}

public void updateViewRoot(){
    logger.entry("EventProvider.updateViewRoot()");

    UIComponent parent=FacesContextWrapper.getCurrentInstance().getViewRoot().findComponent("formBotones-wizardEventContainer");

    if(parent!=null){
        for (Entry<UIComponent, String> entry : tempObjs.entrySet()) {
            parent.getChildren().add(entry.getKey());
        }
    }
}

    public void saveTextLayer(){
    logger.entry("EventProvider.saveTextLayer()");

    List<UIComponent> list=null;

    if(tempObjs.containsValue("text"))
         list=getKeysByValue(tempObjs,"text");

    for (UIComponent c:list){
        if (c instanceof HtmlPanelGroup){
            HtmlPanelGroup panel=(HtmlPanelGroup)c;

            if(panel.getId().equals(getTempTextIdLayer())){
                panel.setStyle(getTempCSS());
                if(panel.getChildren().get(0) instanceof HtmlOutputText){
                    ((HtmlOutputText)panel.getChildren().get(0)).setValue(getTempHTML());
                }

                //Adding delete layer
                Application app=FacesContextWrapper.getCurrentInstance().getApplication();

                HtmlPanelGroup deleteLayer=(HtmlPanelGroup)app.createComponent(HtmlPanelGroup.COMPONENT_TYPE);
                    deleteLayer.setId("delete_" + panel.getId());
                    deleteLayer.setStyle("display:inline-block;width:5px;height:5px;background:white;");
                    deleteLayer.setOnclick("deleteLayer($(this));");
                panel.getChildren().add(0,deleteLayer);

                //Replacing UIComponent
                tempObjs.remove(c);
                tempObjs.put(panel, "text");

                updateViewRoot();

                //Deleting temp vars
                setTempCSS("");
                setTempTextIdLayer("");
                setTempHTML("");
            }
        }
    }