Kendo UI for jQuery数据管理使用教程：网格高度

wrapper。根据web标准，将百分比设置高度的元素要求明确设置其父代的高度。递归地应用此要求，直到达到像素高度的元素或html元素为止。 高度为100％的元素不能具有边距、填充、边框或同级元素，这就是为什么您还必须删除网格的默认边框的原因。

2. 确保Grid内部布局适应“div”wrapper高度的变化，如果这些更改由调整浏览器窗口的大小触发的，请订阅浏览器的窗口调整大小事件并执行Grid的resize方法。 调整大小方法将测量Grid “div”的高度，并调整可滚动数据区域的高度。

• 如果将Grid放置在Kendo      UI Splitter或Kendo UI窗口中，则无需调用resize方法，因为这些小部件将自动执行它。      另外，如果使用锁定列，则不必应用该方法。

• 如果可用于Grid的垂直空间取决于布局的自定义大小调整（由用户控制），请使用与布局更改有关的合适事件或方法来执行Grid的调整大小方法。      在这种情况下，即使您使用锁定的列，也要调用resize方法。

• 在Kendo UI Q3 2013版本之后，resize方法适用于Kendo UI版本。 对于早期版本不是调整大小，请使用以下方法，该方法实际上以相同的方式起作用。

$(window).resize(function() {
var gridElement = $(“#GridID”),
newHeight = gridElement.innerHeight(),
otherElements = gridElement.children().not(“.k-grid-content”),
otherElementsHeight = 0;

otherElements.each(function(){
otherElementsHeight += $(this).outerHeight();
});

gridElement.children(“.k-grid-content”).height(newHeight – otherElementsHeight);
});

 

配置加载指示器

在内部，Grid使用kendo.ui.progress方法在远程读取请求期间显示加载叠加。 如果禁用滚动，则覆盖图会显示在整个网格上。 如果启用了滚动，则覆盖图将显示在可滚动数据区域上。 如果启用了滚动并且Grid没有设置高度，则数据区域最初将具有零高度，这将使加载叠加层在第一个远程请求期间不可见。 要可视化加载叠加层，请使用以下两种方法当中的一个：

• 设置网格的高度

• 将最小高度样式应用于div.k-grid-content元素