Kendo UI for jQuery數(shù)據(jù)管理使用教程：隱藏的容器

---

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四個(gè)控件。Kendo UI for jQuery是創(chuàng)建現(xiàn)代Web應(yīng)用程序的最完整UI庫。

隱藏的容器

如果在隱藏的容器內(nèi)初始化Grid，則Grid可能無法正確調(diào)整其布局。

例如，當(dāng)您應(yīng)用滾動(dòng)、虛擬滾動(dòng)或鎖定的列并在隱藏容器中初始化Grid時(shí)，將無法正確調(diào)整其垂直布局，因?yàn)镴avaScript尺寸計(jì)算不適用于display：none樣式的元素。

如果出現(xiàn)以下任何情況，則可以確定網(wǎng)格是在隱藏狀態(tài)下初始化的：

• 網(wǎng)格看起來小于預(yù)期
• 可滾動(dòng)的數(shù)據(jù)區(qū)域溢出了網(wǎng)格的底部邊框
• 即使啟用了虛擬滾動(dòng)，垂直滾動(dòng)條也不可見
• 凍結(jié)的列太窄，非凍結(jié)的列不可見
• pager可能不會(huì)出現(xiàn)，或者可能是最小的pager，而不是完整的pager

若要處理與隱藏容器內(nèi)的網(wǎng)格初始化有關(guān)的操作，請(qǐng)選擇以下任意一種方法：

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

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

3. 替代其配置中的網(wǎng)格設(shè)置整體高度，而僅可滾動(dòng)數(shù)據(jù)區(qū)域定義高度。在這種情況下，不進(jìn)行高度計(jì)算。 僅當(dāng)不使用凍結(jié)列和虛擬滾動(dòng)時(shí)，此方法才適用。

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

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

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

---

了解最新Kendo UI最新資訊，請(qǐng)關(guān)注Telerik中文網(wǎng)！