これが私のモデルです:
User.Java
public class User {
//...
public List<User> getFriends() {
// ...
}
}
このようなユーザーの友達のテーブルを作成したいと思います:
users.jsf
+ ---------- + ------------ + |ユーザー|フレンズ| + ---------- + ------------ + | |アリス| | + ------------ + |アダム| BOB | | + ------------ + | | PITT | + ---------- + ------------ + | | | ....
ユーザー数が多いため、ユーザーテーブルを一度にダンプすることはできません。
この場合、データテーブルコンポーネントは、ページネーションサポートが組み込まれているため理想的です。列を並べ替えることができるので、それも理想的です...
残念ながら、Primefacesの例では、ユーザー列の行スパンを変更する方法を見つけることができませんでした。
このデータテーブルを作成するにはどうすればよいですか?
この同様の問題を抱えている他のいくつかのOP:
[〜#〜]編集[〜#〜]
これが 私が思いついた最終的な解決策 です。
@Keremの回答に基づいて、私が思いついた解決策は次のとおりです。
ネストされたデータをメインデータテーブルの独自の行のようにするために、CSSクラス.ui-dt-c
をオーバーライドしました。詳細については、h:head
style
タグを確認してください。
<?xml version="1.0" encoding="UTF-8"?>
<html
xmlns="http://www.w3c.org/1999/xhtml"
xmlns:h="http://Java.Sun.com/jsf/html"
xmlns:f="http://Java.Sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:fn="http://Java.Sun.com/jsp/jstl/functions"
xmlns:ui="http://Java.Sun.com/jsf/facelets">
<h:head>
<title>USERS and their friends</title>
<style>
.ui-dt-c {
padding: 0px !important;
}
</style>
</h:head>
<h:body>
<h:form id="form">
<p:dataTable
value="#{users.list}"
var="u">
<p:columnGroup type="header">
<p:row>
<p:column headerText="USER" />
<p:column headerText="FRIENDS" />
</p:row>
</p:columnGroup>
<p:column>#{u.name}</p:column>
<p:column>
<p:dataTable
value="#{u.friends}"
var="f">
<p:column>#{f.name}</p:column>
</p:dataTable>
</p:column>
</p:dataTable>
</h:form>
列内で別のデータテーブルを使用するだけです:)
<h:column>
<h:dataTable var="friend" value="#{user.friends}">
<h:column>
<h:outputText value="#{friend.name}"/>
</h:column>
</h:dataTable>
</h:column>
これは私のローカルホストでどのように見えるかです
Primefaces 拡張可能な行 ニーズに対応する必要があります。子行コンポーネントでクリエイティブになる必要があるのはあなただけです。子行コンポーネントとしてプライムフェース データリストコンポーネント を使用できます。次のようになります。
<p:row expansion>
<p:datalist value ="#{yourTableRowVar.friendslist} Var="friend">
#{friend.firstName}
</p:datalist>
</p:row expansion>
私にとっては2つの解決策があります:
1-ユーザーごとに閲覧して友達のリストを取得したい場合は、dataListを使用します。
<p:dataTable value="#{users.list}" var="u">
<p:column headerText="USER">#{u.name}</p:column>
<p:column headerText="FRIENDS">
<p:dataList value="#{u.friends}" var="f">
#{f.name}
</p:dataTable>
</p:column>
</p:dataTable>
2-友達のリストを直接処理できる場合(listFreinds [userName、friend])またはJPQL query:
<p:dataTable value="#{users.listFreinds}" var="u" sortBy="#{u.userName}">
<p:column headerText="USER" groupRow="true">#{u.userName}</p:column>
<p:column headerText="FRIENDS">#{u.friend}</p:column>
</p:dataTable>
2番目のケースは、v6.0.11以降のPrimefaces行グループ化を使用した新しいネイティブソリューションです。
https://www.primefaces.org/showcase/ui/data/datatable/rowGroup.xhtml