jsf - 使用复合组件将列添加到 Primefaces PanelGrid

Question

我对 JSF 和 Primefaces 比较陌生，我想制作一个包含 Primefaces GridPanel 的复合组件:

<composite:interface>
    <composite:attribute name="bind" type="com.whatever.IBackingBean"/>
    <composite:facet name="headerCols"/>
    <composite:facet name="bodyCols"/>
</composite:interface>
<composite:implementation>
<h:form>
    <p:panelGrid>
        <p:row>
            <composite:renderFacet name="headerCols"/>
            <p:column>
                <h:outputText value="Col1" />
            </p:column>
            <p:column>
                <h:outputText value="Col2" />
            </p:column>
            <p:column>
                <h:outputText value="Col3" />
            </p:column>
        </p:row>

        <p:row>
            <composite:renderFacet name="bodyCols"/>
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop1}" />
            </p:column>
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop2}" />
            </p:column>
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop3}" />
            </p:column>
        </p:row>
    </p:panelGrid>
</h:form>
</composite:implementation>

并且希望有这样的用法:

<x:mycomposite bind="#{myBackingBean}">
    <f:facet name="headerCols">
        <p:column>
             <h:outputText value="My Extra Prop"/>
        </p:column>
    </f:facet>
    <f:facet name="bodyCols">
        <p:column>
             <h:outputText value="#{myBackingBean.extraProp}"/>
        </p:column>
    </f:facet>
</x:mycomposite>

但是当我这样做时...不会添加 Facets。我认为这可能与无法使用 <composite:renderFacet> 有关。作为 <p:panelGrid> 的参数这也是(大概)复合 Material 。

因为我需要添加列而不是行，所以我需要在多个位置添加所以 <composite:insertChildren>不起作用。

我大概可以只使用一个属性，但是如何将元素值作为属性值传递呢？由于类似这样的东西似乎不可用:

<x:mycomposite bind="#{myBackingBean}">
    <f:attribute name="headerCols">
        <p:column>
             <h:outputText value="My Extra Prop"/>
        </p:column>
    </f:attribute>
    <f:attribute name="bodyCols">
        <p:column>
             <h:outputText value="#{myBackingBean.extraProp}"/>
        </p:column>
    </f:attribute>
</x:mycomposite>

假设我将合成修改为:

<composite:interface>
    <composite:attribute name="bind" type="com.whatever.IBackingBean"/>
    <composite:attribute name="headerCols"/>
    <composite:attribute name="bodyCols"/>
</composite:interface>
<composite:implementation>
<h:form>
    <p:panelGrid>
        <p:row>
            #{cc.attrs.headerCols}
            <p:column>
                <h:outputText value="Col1" />
            </p:column>
            <p:column>
                <h:outputText value="Col2" />
            </p:column>
            <p:column>
                <h:outputText value="Col3" />
            </p:column>
        </p:row>

        <p:row>
            #{cc.attrs.bodyCols}
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop1}" />
            </p:column>
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop2}" />
            </p:column>
            <p:column>
                <h:outputText value="#{cc.attrs.bind.prop3}" />
            </p:column>
        </p:row>
    </p:panelGrid>
</h:form>
</composite:implementation>

任何人都可以提供任何替代方案或建议如何使使用模式起作用吗？

谢谢!

Answer 1

我将发布我的解决方法，这在技术上不是解决方案 - 所以我认为将其完全标记为这样是不公平的。

这不是真正的解决方案的原因是因为它实际上并没有使用 Primefaces <p:panelGrid> (我慢慢地开始厌恶其布局选项——但那是另一个话题)而是只使用 HTML5 <table> .它实现了我想要的总体目标，但需要我确保手动将所有正确的 Primefaces 样式添加到表格小部件，以便外观和感觉保持一致。

如果有人有替代解决方案，我很乐意看到。

<composite:interface>
    <composite:attribute name="bind" type="com.whatever.IBackingBean"/>
    <composite:facet name="headerCols"/>
    <composite:facet name="bodyCols"/>
</composite:interface>
<composite:implementation>
<h:form>
<table>
    <tr>
        <composite:renderFacet name="headerCols"/>
        <th>
            <h:outputText value="Col1" />
        </th>
        <th>
            <h:outputText value="Col2" />
        </th>
        <th>
            <h:outputText value="Col3" />
        </th>
    </tr>

    <tr>
        <composite:renderFacet name="bodyCols"/>
        <td>
            <h:outputText value="#{cc.attrs.bind.prop1}" />
        </td>
        <td>
            <h:outputText value="#{cc.attrs.bind.prop2}" />
        </td>
        <td>
            <h:outputText value="#{cc.attrs.bind.prop3}" />
        </td>
    </tr>
</table>
</h:form>
</composite:implementation>