p：复合组件中的对话框 JS 错误： 未捕获的类型错误： 无法读取未定义的属性"show"

Question

我正在尝试创建一个复合组件，以便在JSF 2.2页面中使用。下面是合成:

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
            xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:p="http://primefaces.org/ui"
            xmlns:cc="http://java.sun.com/jsf/composite">
<cc:interface componentType="searchUser">
    <!-- Define component attributes here -->
    <cc:attribute name="update" type="java.lang.String"
                  shortDescription="the component to update"/>
    <cc:attribute name="widgetVar" type="java.lang.String"/>
</cc:interface>
<cc:implementation>
    <p:dialog header="Search for User"
              widgetVar="#{cc.widgetVar}"
              modal="true"
              id="searchDialog"
            >
        <p:panelGrid columns="2" id="searchPanel">
            <p:outputLabel value="First Name: "
                           for="firstname"
                    />
            <p:inputText id="firstname" value="#{SearchBean.firstname}"/>
            <p:outputLabel value="Last Name: "
                           for="lastname"
                    />
            <p:inputText id="lastname" value="#{SearchBean.lastname}"/>
            <p:commandButton value="search"/>
            <p:dataTable value="#{SearchBean.results}" var="user">
                <p:column headerText="First Name">
                    #{user.firstName}
                </p:column>
                <p:column headerText="Last Name">
                    #{user.lastName}
                </p:column>
                <p:column headerText="E-Mail">
                    #{user.email}
                </p:column>
            </p:dataTable>
        </p:panelGrid>
    </p:dialog>
</cc:implementation>

，我这样使用它:

 <my:searchUser update="foo" id="searchDLG" widgetVar="sdgl"/>
 <p:commandButton onclick="PF('sdgl').show();" type="button" value="search for user" />

目前我的FacesComponent Java是空的:

@FacesComponent("searchUser")
public class searchUser extends UIInput implements NamingContainer {
}

目标是创建一个搜索表单/对话框，我可以在多个位置使用。

我的问题是，在点击我得到错误:Uncaught TypeError: Cannot read property 'show' of undefined .

Answer 1

这不是引用复合属性的正确方式。

<p:dialog widgetVar="#{cc.widgetVar}">

它基本上引用了后台组件本身的属性。

复合属性可通过#{cc.attrs} map获得。

<p:dialog widgetVar="#{cc.attrs.widgetVar}">

JS错误是因为实际的widgetVar值是空的，PF('sdgl')返回undefined，然后你盲目地试图调用show()函数。它基本上就像Java中的NullPointerException。

参见:

• 我们的复合组件wiki页面
Java EE 7教程-复合组件

---

与具体问题无关，这个组合还有另外两个问题:

1. 备用组件不返回UINamingContainer.COMPONENT_FAMILY所需的组件族。您可以通过从UINamingContainer扩展而不是UIInput来修复它，或者通过覆盖getFamily()方法来返回UINamingContainer.COMPONENT_FAMILY。

2. 这不是复合组件的正确用途。没有单一的模型值。也就是说，你没有一个<my:searchUser value="...">与现有的标准组件类似。最好使用包含或标记文件。参见何时使用、标签文件、复合组件和/或自定义组件?否则，重新制作组合，使您最终可以使用<my:searchUser value="#{bean.foundUser}">。