如何在 Primefaces 数据表中表示嵌套数据? [英] How to represent nested data in a Primefaces datatable?
问题描述
这是我的模型:
User.java
公共类用户{//...公共列表<用户>得到朋友(){//...}}我想建立一个这样的用户朋友表:
users.jsf
<前>+------------+------------+|用户 |朋友 |+------------+------------+||爱丽丝 ||+------------+|亚当 |鲍勃 ||+------------+||皮特 |+------------+------------+|||....由于用户较多，无法一次性转储用户表.
数据表组件在这种情况下是理想的，因为它具有内置的分页支持.它也很理想，因为可以对列进行排序...
不幸的是，我无法通过 Primefaces 示例找到一种更改用户列中行跨度的方法.
如何构建这个数据表?
其他一些有类似问题的 OP:
- Primefaces/JSF 嵌套数据表
- 如何做一个包含同一行中带有 Primefaces 的子表的数据表?我的怎么办?
- Primefaces dataTable with rowspan
- ...添加你的?
编辑
这是我想出的最终解决方案.
根据@Kerem 的回答，这里是我想出的解决方案:
为了使嵌套数据像自己的主数据表行一样，我重写了 CSS 类 .ui-dt-c.检查h:head style 标签以了解详细信息.
<h:头><title>用户和他们的朋友</title><风格>.ui-dt-c {填充:0px！重要；}</风格></h:head><h:body><h:form id="表单"><p:数据表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:列><p:数据表value="#{u.friends}"var="f"><p:column>#{f.name}</p:column></p:dataTable></p:列></p:dataTable></h:form>Here is my model :
User.java
public class User {
//...
public List<User> getFriends() {
// ...
}
}
I would like to build a table of user friends like this :
users.jsf
+----------+------------+ | USER | FRIENDS | +----------+------------+ | | ALICE | | +------------+ | ADAM | BOB | | +------------+ | | PITT | +----------+------------+ | | | ....
Since there are many users, it's not possible to dump the user table in one go.
The datatable component is ideal in this case because it has built-in pagination support. It is ideal too because it's possible to sort columns...
Unfortunately, I wasn't able to find through the Primefaces examples a way for changing the rowspan in user columns.
How can I build this datatable ?
Some other OP having this similar issue:
- Primefaces/JSF Nested Data Table
- How to do a dataTable containing a subtable with Primefaces in the same row? What's doing with mine?
- Primefaces dataTable with rowspan
- ... Add yours?
EDIT
Here is the final solution I came up with.
Based on @Kerem's answer, here is the solution I came up with:
In order to make the nested datable like own rows of main datatable, I have overriden the CSS class .ui-dt-c. Check in h:head the style tag for details.
<?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>
这篇关于如何在 Primefaces 数据表中表示嵌套数据?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
