Richfaces数据表怪癖

发布于 2025-01-26 07:19:50 字数 3390 浏览 4 评论 0 原文

使用RichFaces,您可以创建一个数据表:

<rich:dataTable id="myTable" value="#{myBean.values}" var="value">
    <f:facet name="header">
        <rich:columnGroup>
            <rich:column />
            <rich:column>Value 1</rich:column>
            <rich:column>Value 2</rich:column>
            <rich:column>Value 3</rich:column>
            <rich:column>Value 4</rich:column>
        </rich:columnGroup>
    </f:facet>

    <rich:column />
    <rich:column>#{value.val1}</rich:column>
    <rich:column>#{value.val2}</rich:column>
    <rich:column>#{value.val3}</rich:column>
    <rich:column>#{value.val4}</rich:column>

    <f:facet name="footer">
        <rich:columnGroup>
            <rich:column>TOTALS</rich:column>
            <rich:column>#{myBean.totalVal1}</rich:column>
            <rich:column>#{myBean.totalVal2}</rich:column>
            <rich:column>#{myBean.totalVal3}</rich:column>
            <rich:column>#{myBean.totalVal4}</rich:column>
        </rich:columnGroup>
    </f:facet>
</rich:dataTable>

这将生成一个基本的HTML &lt; table; gt; 带有五列,一个标头和一个页脚。

但是,如果您这样做(&lt; rich:datatable&gt; 是完全相同的):

<div id="myTableHeader"></div>
<div id="myTableBody">
    <rich:dataTable id="myTable" value="#{myBean.values}" var="value">
        <f:facet name="header">
            <rich:columnGroup>
                <rich:column />
                <rich:column>Value 1</rich:column>
                <rich:column>Value 2</rich:column>
                <rich:column>Value 3</rich:column>
                <rich:column>Value 4</rich:column>
            </rich:columnGroup>
        </f:facet>

        <rich:column />
        <rich:column>#{value.val1}</rich:column>
        <rich:column>#{value.val2}</rich:column>
        <rich:column>#{value.val3}</rich:column>
        <rich:column>#{value.val4}</rich:column>

        <f:facet name="footer">
            <rich:columnGroup>
                <rich:column>TOTALS</rich:column>
                <rich:column>#{myBean.totalVal1}</rich:column>
                <rich:column>#{myBean.totalVal2}</rich:column>
                <rich:column>#{myBean.totalVal3}</rich:column>
                <rich:column>#{myBean.totalVal4}</rich:column>
            </rich:columnGroup>
        </f:facet>
    </rich:dataTable>
</div>
<div id="myTableFooter"></div>

Richfaces将在“ mytableheader” &lt; thead&gt; >&lt; div&gt; 和&lt; tfoot&gt; 在“ mytablefooter”内代码>保留在&lt; table&gt; 中,在“ mytablebody” &lt; div&gt; 中。 Richfaces设置了每个单元格的宽度,以使列仍然对齐。请注意,这些元素的ID很重要 - 它们必须从表元素的ID开始,并以这些特定后缀结尾。 &lt; table; 实际上包含显示:无标题的副本以及一个空的页脚。

我只知道这项工作是因为我在某些代码中找到了它,但是我找不到有关此功能的任何文档。 此功能是否在任何地方都记录下来?我真的不知道规则是为了什么。

With RichFaces you can create a data table like this:

<rich:dataTable id="myTable" value="#{myBean.values}" var="value">
    <f:facet name="header">
        <rich:columnGroup>
            <rich:column />
            <rich:column>Value 1</rich:column>
            <rich:column>Value 2</rich:column>
            <rich:column>Value 3</rich:column>
            <rich:column>Value 4</rich:column>
        </rich:columnGroup>
    </f:facet>

    <rich:column />
    <rich:column>#{value.val1}</rich:column>
    <rich:column>#{value.val2}</rich:column>
    <rich:column>#{value.val3}</rich:column>
    <rich:column>#{value.val4}</rich:column>

    <f:facet name="footer">
        <rich:columnGroup>
            <rich:column>TOTALS</rich:column>
            <rich:column>#{myBean.totalVal1}</rich:column>
            <rich:column>#{myBean.totalVal2}</rich:column>
            <rich:column>#{myBean.totalVal3}</rich:column>
            <rich:column>#{myBean.totalVal4}</rich:column>
        </rich:columnGroup>
    </f:facet>
</rich:dataTable>

This generates a basic HTML <table> with five columns, a header, and a footer.

However, if you do this instead (the <rich:dataTable> is exactly the same):

<div id="myTableHeader"></div>
<div id="myTableBody">
    <rich:dataTable id="myTable" value="#{myBean.values}" var="value">
        <f:facet name="header">
            <rich:columnGroup>
                <rich:column />
                <rich:column>Value 1</rich:column>
                <rich:column>Value 2</rich:column>
                <rich:column>Value 3</rich:column>
                <rich:column>Value 4</rich:column>
            </rich:columnGroup>
        </f:facet>

        <rich:column />
        <rich:column>#{value.val1}</rich:column>
        <rich:column>#{value.val2}</rich:column>
        <rich:column>#{value.val3}</rich:column>
        <rich:column>#{value.val4}</rich:column>

        <f:facet name="footer">
            <rich:columnGroup>
                <rich:column>TOTALS</rich:column>
                <rich:column>#{myBean.totalVal1}</rich:column>
                <rich:column>#{myBean.totalVal2}</rich:column>
                <rich:column>#{myBean.totalVal3}</rich:column>
                <rich:column>#{myBean.totalVal4}</rich:column>
            </rich:columnGroup>
        </f:facet>
    </rich:dataTable>
</div>
<div id="myTableFooter"></div>

RichFaces will place the <thead> inside the "myTableHeader" <div> and the <tfoot> inside the "myTableFooter" <div>, with the <tbody> remaining inside the <table> in the "myTableBody" <div>. RichFaces sets the width of every cell so that the columns still line up. Note that the ID's of these elements are important - they must start with the ID of the table element and end with these specific suffixes. The <table> actually contains a display:none copy of the header as well, and an empty footer.

I only know this works because I found it in some of our code, but I haven't been able to find any documentation on this feature. Is this feature documented anywhere? I don't really know what the rules are for it.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文