首页 > 解决方案 > GWT 网格单元不换行

问题描述

我正在使用 GWT GridPanel。我希望其中一列可以换行,但我尝试过的没有任何效果。在关联的 css 文件中,我尝试过:

.x-grid3-cell-inner .x-grid3-col-note {
    overflow: visible; white-space: normal !important;
}

其中 note 是我要包装的列的名称。没用。我试过了:

.x-grid3-cell {
    white-space:wrap;
}

没用。我试过了:

.x-grid3-cell-inner {
    cell-wrap: true;
}

没用。任何人都有一个有效的简单解决方案?

编辑:我也尝试在 ColumnConfig 中设置 id,如下所示:

ColumnConfig[] columns = new ColumnConfig[] {
        new ColumnConfig("Note", "note", 130, true, null, "note"),
        new ColumnConfig("Date", "date", 65, true)
};

ColumnConfig c = columns[0];
c.setId("noteColumn");

然后在我添加的css中:

#noteColumn {
    overflow: visible; white-space: normal !important;
}

但这也没有用。

标签: javascriptjavacssgwt

解决方案


这是一个GWT-Ext 小部件。在文档中有一些关于如何包装单元格内容的示例。

例如,使用它来全局包装所有单元格内容

 .x-grid3-cell-inner {
      overflow: visible; white-space: normal !important;
 }

您可以使用以下setId()方法ColumnConfig

将 id 分配给 ColumnConfig 会导致列 dom 元素具有该 ID。这对于将自定义 css 应用于整个列很有用。

如果id=note那么 css 规则应该是:

.x-grid3-col-note {
      overflow: auto; white-space: normal !important;
 }

推荐阅读