如何在 JSF 数据表中应用换行文本样式？

Posted 2023-02-22

【中文标题】如何在 JSF 数据表中应用换行文本样式？

【英文标题】：How to apply wrap text style in JSF datatable?

【发布时间】：2013-12-27 22:35:01

【问题描述】：

我的应用程序中有一个数据表，我将列 width 固定为 200。如果我以datatable column 打印小行，则表示它打印的格式正确。如果我在datatable 列中打印冗长的行，则表示无法将其包裹起来。我怎么能wraptext在数据表列。

问题描述

【问题讨论】：

@alexander：那时也与 jsf 无关，与数据表无关，所有只是 'table' 然后......所以 html 和 css。为什么不添加这些标签。答案是关于 PrimeFaces，所以问题是关于 PrimeFaces 数据表... imo 错误编辑标签

【参考方案1】：

以下内容在 Chrome 中对我有用，而不是在 IE 中

.preformatted 
    white-space: pre-wrap;
    word-break: break-all;

<p:column>
   <h:outputText value="#bean.txt" styleClass="preformatted" />
</p:column>

【讨论】：

如果上述样式应用于列级别，即 '' 那么它在 IE 和 Chrome 中都可以正常工作

【参考方案2】：

    <style type="text/css" >

    .preformatted 
    white-space: pre-wrap;
    word-break: break-all;
     

</style>

在数据表列中

【参考方案3】：

我的解决方案是将 word-break 样式应用于列。就像：

                <p:column id="accountsMaskColumn"
                          headerText="#msg['mr.settings.headers.accountMask']"
                          filterBy="#item.accountMask"
                          sortBy="#item.accountMask"
                          style="word-break: break-word">
                    <h:outputText value="#item.accountMask"/>
                </p:column>

希望有人觉得这很有用

【参考方案4】：

您可以通过 CSS word-wrap 属性控制自动换行。在表格内部，这只需要将table-layout 属性设置为fixed，这样固定宽度的列在内容较大时不会自动展开。

例如

.fixed-size 
    table-layout: fixed;
    word-wrap: break-word;

和

<p:dataTable ... styleClass="fixed-size">

【讨论】：

@BalusC，有没有办法在换行时不中断单词？