Kendo UI for jQuery數據管理使用教程：隱藏的容器

---

Kendo UI for jQuery R2 2020 SP1試用版下載

Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四個控件。Kendo UI for jQuery是創建現代Web應用程序的最完整UI庫。

隱藏的容器

如果在隱藏的容器內初始化Grid，則Grid可能無法正確調整其布局。

 例如，當您應用滾動、虛擬滾動或鎖定的列并在隱藏容器中初始化Grid時，將無法正確調整其垂直布局，因為JavaScript尺寸計算不適用于display：none樣式的元素。

如果出現以下任何情況，則可以確定網格是在隱藏狀態下初始化的：

• 網格看起來小于預期
• 可滾動的數據區域溢出了網格的底部邊框
• 即使啟用了虛擬滾動，垂直滾動條也不可見
• 凍結的列太窄，非凍結的列不可見
• pager可能不會出現，或者可能是最小的pager，而不是完整的pager

若要處理與隱藏容器內的網格初始化有關的操作，請選擇以下任意一種方法：

 1. 延遲Grid的初始化或更改各種Kendo UI窗口小部件的初始化順序，以便在其元素可見后初始化Grid。

2. 小部件可見后，執行Grid的resize方法。

 3. 替代其配置中的網格設置整體高度，而僅可滾動數據區域定義高度。在這種情況下，不進行高度計算。 僅當不使用凍結列和虛擬滾動時，此方法才適用。

#GridID .k-grid-content
{
height: 270px;
}

 4. 獲取數據源，替代resize()方法。如果啟用了虛擬滾動并且Kendo UI版本低于2014.3.1119，則此方法適用。

$("#GridID").data("kendoGrid").dataSource.fetch();

---