设置冻结列的宽度答案

【问题标题】：Set width of a frozen column设置冻结列的宽度
【发布时间】：2014-07-28 01:15:53
【问题描述】：

我正在尝试使用来自 PrimeFaces ShowCase 的 Frozen Column。

但是我不能设置第一个冻结列的宽度，这实在是太宽了。

谁能告诉我怎么解决？

XHTML：

<p:dataTable var="car" value="#{dtScrollView.cars}" 
             scrollable="true" scrollHeight="150"
             scrollWidth="300" frozenColumns="1">
   <p:column headerText="Id" footerText="Model">
      <h:outputText value="#{car.model}" />
   </p:column>
   <p:column headerText="Year" footerText="Year">
      <h:outputText value="#{car.year}" />
   </p:column>  
</p:dataTable>

我正在使用 PrimeFaces 5.0。

【问题讨论】：

当您使用<p:rowEditor/> 编辑/更新由<p:dataTable> 保存的行并冻结列时，您是否遇到this 类型的问题？ <p:dataTable> 冻结列/s 无法正常运行，当其中的行被更新时。

标签： css jsf jsf-2 primefaces datatable

【解决方案1】：

要更改冻结列的宽度，请使用以下 CSS 类：

/* Change frozen width */
.ui-datatable-frozenlayout-left {
   width: 20%;
}

这是online Demo，以及github 上的示例代码。

希望这会有所帮助。

【讨论】：

完美！谢谢你:)

【解决方案2】：

你，

在<p:column> 中添加属性样式，如下所示：

<p:column headerText="Id" footerText="Model" style="width: 10%;">
                <h:outputText value="#{car.model}" />
            </p:column>

试一试，没问题:)

【讨论】：

我已经更新了我的回复，我已经尝试了 :) 是工作；不要忘记投票:)
把 scrollHeight="150" scrollWidth="300" 改成 scrollHeight="550" scrollWidth="800" 试试

【解决方案3】：

试试下面的代码

<p:column headerText="Id" footerText="Model" style="width:20px;">
    <h:outputText value="#{car.model}" />
</p:column>

你可以随意改变宽度值

【讨论】：