jsf - 面を使用してデータ テーブルの複数の行にデータを含むレコード

Question

JSFでは、次のようにデータテーブルにレコードを表示させることは可能ですか?

      [Name  ][Last Name][Age]
1.    John     Doe         20
      Extra info on record 1

2.    John     Smith       20
      Extra info on record 2

ありがとうございました

Answer 1

これを行うにはいくつかの方法があると確信しています。

テーブルのネストを気にしない場合は、panelGridタグと CSS を使用できます。

意見：

<f:view>
    <h:dataTable value="#{peopleBean.people}" var="row">
        <h:column id="column1">
            <f:facet name="header">
                <h:panelGrid columns="3" columnClasses="cell,cell,age">
                    <h:outputText value="First Name" />
                    <h:outputText value="Last Name" />
                    <h:outputText value="Age" />
                </h:panelGrid>
            </f:facet>
            <h:panelGrid columns="3" columnClasses="cell,cell,age">
                <h:outputText value="#{row.firstname}" />
                <h:outputText value="#{row.lastname}" />
                <h:outputText value="#{row.age}" />
            </h:panelGrid>
            <h:outputText styleClass="extra" value="#{row.extraInfo}" />
        </h:column>
    </h:dataTable>
</f:view>

スタイルシート:

TABLE {
    width: 100%;
}

TABLE TR TD {
    text-align: left;
}

.cell {
    width: 40%;
}

.age {
    width: 20%;
}

.extra {
    background-color: silver;
    padding: 4px;
    display: block;
    width: 100%;
}

Answer 2

RichFaces などの 3 番目のライブラリを使用すると、subTable の原則を使用してこれを行うことができます。この例は RichFaces から確認できます。やりたいことと比べると少し複雑ですが、subTableコンポーネントの使い方を示しています...