我正在尝试从 javascript 绑定到可滚动的剑道网格,并且在列宽方面存在一些问题。这个小提琴演示了这个问题(问题末尾的代码)。我在 html 中指定标题并向其中一个标题添加宽度。然后 javascript 设置数据源(在生产代码中,这是通过 ajax 调用完成的)。
我想避免在 javascript 中设置 columns.width 属性,因为
- 我有很多网格,因为我的视图模型经过精心构造,能够自动识别所需的列。我们的应用程序中有 100 多个网格,并且必须为所有网格指定列列表会很笨拙。
- 无论如何感觉不对,这是样式信息。
我确实了解该功能是由于 kendo 创建了两个网格,一个用于标题,一个用于滚动内容。但是,我过去使用的其他类似操作的控制库总是在两个网格之间复制样式信息,以便在保持两个表同步的同时促进声明式样式 - 我只是不确定“剑道”是什么方法是。
来自小提琴的 HTML
<table>
<thead>
<th class="p20" data-field="status">Status</th>
<th data-field="description">Description</th>
</thead>
</table>
Javascript
$('table').kendoGrid({
dataSource: [
{ status: 'On', description: 'a longer description' },
{ status: 'On', description: 'a longer description' },
{ status: 'On', description: 'a longer description' },
{ status: 'On', description: 'a longer description' },
{ status: 'On', description: 'a longer description' },
{ status: 'On', description: 'a longer description' }
],
scrollable: true
});
CSS
.k-grid-content {
height: 100px;
}
.p20 {
width: 20%;
}