KendoUI网格栏autosizing

Question

我想创建一个网格，必须有自动调整大小的列（在一些限制内），其宽度不得超过父div的宽度。

我有4列：

 col1  col2 col3 col4 
------------------------------------------ 
| very long text | ... | ... | ... | 
|  ...  | ... | ... | ... | 
------------------------------------------ 

在第一列中的值非常长，所以我用造型：white-space: nowrap; text-overflow: ellipsis;文本停留在一行。我想col2为105-170像素，col3 40-190px和col4 75-150px。我喜欢尽可能小，以避免出现巨大的空白。

我知道这样的事情可以通过设置scrollable: true来实现，但我不需要滚动条，我真的不喜欢它如何坐在那里没有好用。

Answer 1

在玩过不同的选项和几个小时的搜索之后，我决定使用一个不那么优雅的解决方案，但是我已经实现了我在寻找的东西。如果有人面临着类似的问题，这里是我做过什么：

• 当DOM负载（jQuery的$(document).ready(...)或$(...)），我调用代码删除右边的.k-grid-headerpadding-right和删除的.k-grid-contentoverflow-y。

我使用的代码：

// jQuery code 
$(".k-grid-header").css("padding-right","0"); 
$(".k-grid-content").css("overflow-y","initial"); 

// JS (without jQuery) equivalent 
var gridHeaders = document.querySelectorAll(".k-grid-header"); 
for (var i = 0, element; element = gridHeaders[i++];) 
    element.paddingRight = "0"; 

var gridContent = document.querySelectorAll(".k-grid-content"); 
for (var i = 0, element; element = gridContent [i++];) 
    element.overflowY = "initial";