Web界面開發工具!Kendo UI for jQuery數據管理:調整列大小等

點擊“瞭解更多”獲取Kendo UI for jQuery R1 2020 SP2試用版下載

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中列大小的演示。


<code>


<title>
<link>
<link>
<link>
















/<code>


禁用滾動並調整Grid列的大小時,其他列也會更改寬度,以便所有列寬度的總和保持恆定。 如果列和Grid

均已應用了其最小可能寬度,則列的大小調整將停止工作。 在這種情況下,請在以下兩種方法中選擇一種使用:
  • 將較大的寬度應用於網格
  • 啟用滾動

啟用滾動並調整列的大小時,所有其他列均保持其寬度。 當應用列大小調整時,關於所有列寬度的總和,可能會產生以下結果:

  • 如果所有列寬度的總和大於Grid的寬度,則會出現一個水平滾動條。
  • 如果所有列寬的總和等於Grid的寬度,則不會出現水平滾動條。
  • 如果所有列寬度的總和小於Grid的寬度,則最後一列後會出現一個空白。

根據設計,網格的最後一列沒有右邊框,因此如果網格表的寬度與網格小部件的寬度匹配,則網格的右端將不會出現雙邊框。如果需要,您可以在以下示例中為CSS代碼應用右邊框, #ccc邊框的顏色值必須與Kendo UI主題中單元格邊框的顏色匹配,為此請使用DOM檢查器檢查表單元格的樣式。


<code>.k-grid-header-wrap > table,
.k-grid-content > table {
border-right: 1px solid #ccc;
}/<code>


列的重新排序

Grid提供用於重新排序其列的選項。若要使用戶能夠通過拖動來重新排序網格的列,請將reorderable屬性設置為true。 有關可運行的示例,請參閱有關在Grid中實現列重新排序的演示。


<code>


<title>
<link>
<link>
<link>


















/<code>
"


分享到:


相關文章: