Question

我有一个YUI数据表，我将以下数据放在表中：

 {key:"name", label:"name", editor: nameChoiceEditor},
 {key:"group", label:"group", editor: groupChoiceEditor},
 {key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor},
 ...

此处name列的宽度设置为为该名称输入的最大字符长度，与group相同。无论数据的长度如何，colony的列宽都设置为210。

我的问题是name列有多个单词，例如“odaiah chitukuri”，显示在两行中，如下所示：

  odaiah
  chitukuri

但是当它像“odaiahchitukuri”这样的单词时，它会显示在一行中，这意味着该列正在调整以适应这个词。

我应该在sigle line中有不同的单词。怎么做？

Answer 1

将'break'空格替换为不间断的空格。

尝试以下方法：

更改：

{key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor},

要：

{key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor
  formatter: function (el, oRecord, oColumn, oData) {
    el.innerHTML = oData.replace(/ /g, '&nbsp;');
  }
},

Answer 2

我不确定您是否正在寻找一种始终将单词保持在单行上的解决方案..但一般来说，数据表可以很好地根据内部内容正确地隔开列。在某些情况下，我必须手动设置列的宽度。以下是具有类appicon的列的示例：

.yui-skin-sam .yui-dt tbody td.appicon {
    width: 40px;
}

一旦列中的单词数超出其定义的大小，就会记住它，它将始终移动到下一行。

Answer 3

在datatable列中定义：

将是width:100
不是width:"100px"
或width:"100"
或width:"100em"

使用宽度：100

就像那样，它对我来说工作正常

如何根据Column的最大大小动态设置YUI数据表的宽度

3 个答案: