Question

我想创建一个如下所示的表：

                 Table Header

SubHeader 1 | SubHeader 2

InfoType1.Info1 | InfoType1.Info2

SubHeader 3

InfoType2.List.get（0）.var1 | InfoType2.get（0）.var2

...

InfoType2.List.get（N）.var1 | InfoType2.get（N）.var2

我试过用jsf子表做这个，但是我不确定它是否可能，到目前为止我还没有找到任何方法将多个子表包含在一个数据表中，共享相同的标题。请注意，SubHeader3下面的信息来自与SubHeader 1和2的信息不同的数据源。任何帮助将不胜感激！请原谅丑陋的格式，但我不知道如何在发布时保留ascii，而且我没有图片示例。

Answer 1

你可以将一些panelGrid嵌套在一起。

XHTML页面：

<h:body>
    <style>
.hide-column-names table thead tr {
    display: none;
}
</style>
    <h:form>
        <p:panelGrid columns="1" border="1">
            <p:panelGrid columns="2" border="1" style="width:100%;">
                <f:facet name="header">
             Table Header
        </f:facet>
                <p:panelGrid columns="1" border="1" style="width:100%;">
                    <f:facet name="header">
             SubHeader 1
        </f:facet>
                    <h:outputLabel value="#{bean.info1}" />
                </p:panelGrid>
                <p:panelGrid columns="1" border="1" style="width:100%;">
                    <f:facet name="header">
             SubHeader 2
        </f:facet>
                    <h:outputLabel value="#{bean.info2}" />
                </p:panelGrid>
            </p:panelGrid>
            <p:dataTable var="list" value="#{bean.listInfoType}" styleClass="hide-column-names">
                <f:facet name="header">
             SubHeader 3
        </f:facet>
                <p:column>
                    <h:outputText value="#{list.info1}" />
                </p:column>
                <p:column>
                    <h:outputText value="#{list.info2}" />
                </p:column>
            </p:dataTable>
        </p:panelGrid>
    </h:form>
</h:body>

Bean：

@ManagedBean(name = "bean")
@ViewScoped
public class bean implements Serializable {

    private static final long serialVersionUID = 1L;

    private String info1;
    private String info2;
    private List<InfoType> listInfoType;

    public bean() {
        info1 = "info1";
        info2 = "info2";
        listInfoType = new ArrayList<InfoType>();
        listInfoType.add(new InfoType("var 1 1", "var 1 2"));
        listInfoType.add(new InfoType("var 2 1", "var 2 2"));
        listInfoType.add(new InfoType("var 3 1", "var 3 2"));
        listInfoType.add(new InfoType("var 4 1", "var 4 2"));
        listInfoType.add(new InfoType("var 5 1", "var 5 2"));
        listInfoType.add(new InfoType("var 6 1", "var 6 2"));
        listInfoType.add(new InfoType("var 7 1", "var 7 2"));
        listInfoType.add(new InfoType("var 8 1", "var 8 2"));
        listInfoType.add(new InfoType("var N 1", "var N 2"));
    }

    public List<InfoType> getListInfoType() {
        return listInfoType;
    }

    public void setListInfoType(List<InfoType> listInfoType) {
        this.listInfoType = listInfoType;
    }

    public String getInfo1() {
        return info1;
    }

    public void setInfo1(String info1) {
        this.info1 = info1;
    }

    public String getInfo2() {
        return info2;
    }

    public void setInfo2(String info2) {
        this.info2 = info2;
    }

}

结果：

enter image description here

我希望这个例子可以帮到你！如果不是这样，请告诉我。

多个jsf表合二为一

1 个答案: