Question

我需要在两个表单之间传递一个参数，这两个表单都在一个单独的ui：define。

中

我有一个网站，其中左边的部分是树桌，中间部分是表格。我想单击左侧的节点并将其id传递给稍后将使用它的中心部分。

目标是让用户能够向左侧的treetable添加新类别。所以我提出一个想法，如果用户点击treetable上的“+”符号，则会显示一个在此之前隐藏的表单。

这是布局的主要部分。

        <p:layoutUnit position="west" size="600" header="Categories" resizable="true" closable="false" collapsible="true">
            <h:form>
                <ui:insert name="westContent">West default content</ui:insert>
            </h:form>
        </p:layoutUnit>

        <p:layoutUnit position="center">
            <h:form>
                <ui:insert name="centerContent">Center default content</ui:insert>
            </h:form>
        </p:layoutUnit>

这是treetable所在的左侧内容。我想将document.id传递给位于centerContent中的另一个表单。

<ui:define name="westContent">
    <h:form id="form">

        <p:treeTable value="#{documentsController.root}" var="document"
                     selection="#{documentsController.selectedNodes}" selectionMode="single">

            <p:column style="width:300px">
                <f:facet name="header">
                    Name
                </f:facet>
                <h:outputText value="#{document.name}" />
            </p:column>

            <p:column style="width:20px">
                <f:facet name="header">
                    Add Category
                </f:facet>
                <p:commandButton value="+" styleClass="ui-priority-primary"
                                 actionListener="#{editorBean.print}"
                                 onclick="addCategory.show();">
                </p:commandButton>

            </p:column>

        </p:treeTable>

    </h:form>
</ui:define>

这是我希望将document.id传递到的中心内容。

<ui:define name="centerContent">
    <h:form id="addCategoryForm">
        <p:panel id="addCategory" widgetVar="addCategory" header="New Category" style="margin-bottom:10px;" closable="true" visible="false">
            <p:messages id="messages" />
            <h:panelGrid columns="3">
                <h:outputLabel for="name" value="Name: *" />
                <p:inputText id="name" value="#{editorBean.name}" required="true" label="Name">
                    <f:validateLength minimum="2" />
                </p:inputText>
                <p:message for="name" />

                <h:outputLabel for="description" value="Description: *" />
                <p:inputText id="description" value="#{editorBean.description}" required="true" label="Description"/>
                <p:message for="description" />
            </h:panelGrid>
            <h:panelGrid columns="1">
                <h:outputLabel value="Html" />
                <pe:ckEditor id="editor" value="#{editorBean.html}" interfaceColor="#cccccc" />

                <p:commandButton id="submitButton" value="Submit" update="addCategoryForm" 
                                 icon="ui-icon-disk" actionListener="#{editorBean.print}" />
            </h:panelGrid>
        </p:panel>
    </h:form>
</ui:define>

这是我正在使用的托管bean的结构。

@ManagedBean
@Scope("view")
public class EditorBean {

    private String name;
    private String description;
    private String html;
    private boolean isCategory;
    private int id;

}

我习惯使用jsp和在构造函数中处理事物的旧样式，所以这对我来说非常困惑。我对这个问题的任何其他解决方案持开放态度。

我以为我可以将treetable中的id填入EditorBean并稍后填写其余内容，但它似乎不起作用。

感谢您的回复

Answer 1

只需在bean中创建一个属性，通过左侧窗体中的命令按钮保留当前选定的文档，并以您看到的任何方式从右侧窗体中访问它。

例如，向bean添加一个属性：

private Document selected;//getter + setter

在命令按钮的操作方法（EL 2.2及更高版本）中预设，或使用<f:setPropertyActionListener>（EL低于2.2）预设。另请注意，onclick是挂钩AJAX回调事件的错误位置，请改为使用oncomplete：

<p:commandButton value="+" styleClass="ui-priority-primary"
                 actionListener="#{editorBean.print}"
                 action="#{editorBean.action(document)}"
                 oncomplete="addCategory.show();">
</p:commandButton>

与

public void action(Document document) {
    selected = document;
    //other business logic
}

或：

<p:commandButton value="+" styleClass="ui-priority-primary"
                 actionListener="#{editorBean.print}"
                 oncomplete="addCategory.show();">
    <f:setPropertyActionListener target="#{editorBean.selected}" value="#{document}" />
</p:commandButton>

这样，当前单击的项目将在您的bean中可用。如果需要，您可以在操作方法中对其进行分解。它可以被另一个表单引用，而另一个表单的id可以包含在AJAX更新中，以便这些更改将反映在其中。

Primefaces - 如何在2 ui之间传递参数：define

1 个答案: