Làm thế nào để biểu diễn dữ liệu lồng nhau trong một dữ liệu Primefaces?

Đây là mô hình của tôi:Làm thế nào để biểu diễn dữ liệu lồng nhau trong một dữ liệu Primefaces?

User.java

public class User { 
    //... 

    public List<User> getFriends() { 
     // ... 
    } 
}

Tôi muốn xây dựng một bảng của bạn bè người sử dụng như thế này:

users.jsf

 
+----------+------------+ 
| USER | FRIENDS | 
+----------+------------+ 
|   | ALICE | 
|   +------------+   
| ADAM | BOB  | 
|   +------------+ 
|   | PITT | 
+----------+------------+ 
|   |   | 
....

Vì có nhiều người dùng, không thể đổ t người dùng bảng trong một lần.

Thành phần có thể định lượng là lý tưởng trong trường hợp này bởi vì nó có hỗ trợ phân trang dựng sẵn. Điều này cũng lý tưởng vì có thể sắp xếp các cột ...

Thật không may, tôi không thể tìm thấy qua các ví dụ của Thủ tướng một cách để thay đổi hàng trong cột người dùng.

Làm cách nào để tôi có thể tạo dữ liệu này?

Một số OP khác có vấn đề tương tự này:

EDIT
Đây là the final solution I came up.

Nguồn

2012-11-30 Stephan

Dựa trên @ câu trả lời Kerem của, đây là giải pháp tôi đến với:

Để làm cho lồng nhau xác định niên đại như hàng riêng của DataTable chính, tôi đã overriden sự Lớp CSS .ui-dt-c. Đăng ký h:head thẻ style để biết chi tiết.

<?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>

Nguồn

2017-01-19 16:54:51 Stephan

Thủ tướng expandable rows cần giải quyết nhu cầu của bạn, chỉ bạn sẽ cần sáng tạo với thành phần hàng con. Bạn có thể sử dụng các mặt chính data list component làm thành phần hàng con. Nó sẽ giống như thế:

<p:row expansion> 
    <p:datalist value ="#{yourTableRowVar.friendslist} Var="friend"> 
    #{friend.firstName} 
    </p:datalist> 
    </p:row expansion>

Nguồn

2012-11-30 17:31:45 kolossus

Chỉ cần sử dụng một bảng dữ liệu bên trong cột của bạn :)

<h:column> 
    <h:dataTable var="friend" value="#{user.friends}"> 
     <h:column> 
      <h:outputText value="#{friend.name}"/> 
     </h:column> 
    </h:dataTable> 
</h:column>

Đây là cách nó trông trên localhost của tôi

enter image description here

Nguồn

2012-11-30 22:41:54

Một tùy chọn khác là sử dụng ui:repeat bên trong một cột để có được tất cả các giá trị của một bộ sưu tập.

Ví dụ:

<p:dataTable var="user" value="#{userGroupBacking.users}" id="userTable"> 

    <p:column headerText="User"> 
     <h:outputText value="#{user.name}" /> 
    </p:column> 

    <p:column headerText="Groups"> 
     <ui:repeat var="group" value="#{user.groups}"> 
      <h:outputText value="#{group.name}" /><br /> 
     </ui:repeat> 
...

Nguồn

2013-10-16 19:20:27 Catfish

Đối với tôi đó là hai giải pháp:

1- Nếu tôi muốn duyệt người dùng bằng cách sử dụng và lấy danh sách bạn bè, trong trường hợp này tôi thích 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- Trong trường hợp nơi mà tôi có thể xử lý trực tiếp danh sách bạn bè (listFreinds [userName, bạn]) hoặc khi tôi đang sử dụng JPQL truy vấn:

<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>

Các trường hợp thứ hai, là giải pháp gốc mới với Nhóm hàng thủ công từ v6.0.11

https://www.primefaces.org/showcase/ui/data/datatable/rowGroup.xhtml

Nguồn

2017-04-26 11:57:02 bilelovitch

Bạn có thể minh họa câu trả lời của mình bằng mã mẫu không? – Stephan

Làm thế nào để biểu diễn dữ liệu lồng nhau trong một dữ liệu Primefaces?

Trả lời

Các vấn đề liên quan