如何根据列的最大大小动态设置yui -data表的宽度

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"，它显示在单行中，这意味着该列正在调整以适应该单词。

我应该把不同的单词放在一行。怎么做呢?

Answer 1

将分隔符替换为非分隔符

尝试以下操作:

改变:

{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, ' ');
  }
},

Answer 2

我不确定你是否在寻找一个解决方案，将始终保持单行的单词。但一般来说，数据表可以很好地根据内部内容正确地分隔列。在某些情况下，虽然我必须手动设置列的宽度。下面是一个带有appicon类的列的例子:

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

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

Answer 3

在数据表列中定义:

• 为width:100
• not width:"100px"
• 或width:"100"
• 或width:"100em"

使用宽度:100

像这样，那么它对我来说工作得很好