Richfaces DataTable 中行的扩展功能

Question

我正在寻找一种方法来实现 Richfaces DataTable 行的扩展功能。用户将单击位于数据表第一列（每行）的“+”链接，该行将“展开”（意味着新文本将显示在当前行之间和下一个）。

我可以正常工作，唯一的问题是扩展视图中的所有信息都显示在该行的第一列部分中。我想做的是在整行中显示“扩展”文本（就好像“扩展”文本行不被列划分）。

有什么建议吗？我对 jsf/richfaces 有点陌生，因此任何示例代码将不胜感激。

Answer 1

您可以使用 rich:column 组件上的 breakBefore 属性来执行此操作。 RF 演示页面。

如果您在最后一列定义了 breakBefore 属性，那么它会为您工作。一个例子：

<rich:dataTable id="mytbl" value="#{mybean.mydata}" var="row">
     <rich:column>
        <a4j:commandLink reRender="mytbl">
            <h:graphicImage value="#{row.toggleImage}"></h:graphicImage>
            <a4j:actionparam name="shown" value="#{not row.expand}" assignTo="#{row.expand}"/>
        </a4j:commandLink>
    </rich:column>
    <rich:column>
        <f:facet name="header">col 2</f:facet>
        <h:outputText value="#{row.col2}"/>
    </rich:column>
    <rich:column breakBefore="true">
        spans all the other columns
    </rich:column>
</rich:dataTable>   

Answer 2

一种方法是使用 JQuery 功能。

演示链接 http://jsfiddle.net/BU28E/1/ 。

这里的一项额外开销是您需要检查 rich:dataTable 如何呈现为 Html 并为 jQuery 提供 DOM 模型。在 Richfaces 中拥有这样的功能有点棘手，并且需要一些复杂的解决方法。