HTML5 Web app开发工具Kendo UI Web中Grid网格控件的使用
Kendo UI Web中的Grid控件不僅可以顯示數據,并對數據提供了豐富的支持,包括分頁、排序、分組、選擇等,同時還有著大量的配置選項。使用Kendo DataSource組件,可以綁定到本地的JSON數據或者是遠程的數據。
創建Kendo Grid:
1、從現有的HTML表格元素中,用HTML定義組、行、和數據。
2、從 HTML div 元素中,用配置定義列和行,并綁定到數據。
從現有的HTML表格元素創建Kendo Grid:>>>示例代碼
初始化Kendo Grid
$(document).ready(function(){ $("#grid").kendoGrid(); });從 HTML div 元素中創建網格
<!-- Define the HTML div that will hold the Grid --> <div id="grid"> </div>初始化Kendo Grid并配置列 & 數據綁定 >>>示例代碼
配置網格操作
?? Kendo Grid分頁、排序、分組和滾動,使用簡單的布爾配置選項就可以配置任意的網格操作。啟用網格分頁、排序、分組和滾動操作,在默認的情況下這些操作都是禁用的,之后滾動在默認的情況下是啟用的:
$(document).ready(function(){$("#grid").kendoGrid({groupable: true,scrollable: true,sortable: true,pageable: true});});虛擬滾動性能
??? 當綁定到大型數據集或使用大的頁面尺寸時,對于性能來說減少在內存中的DOM對象是非常重要的。Kendo Grid對于高度優化綁定到大數據集綁定提供內置的UI virtualization,通過簡單的配置就可以啟用。
>>>示例代碼
?
轉載于:https://www.cnblogs.com/lgzoppa/p/3396112.html
總結
以上是生活随笔為你收集整理的HTML5 Web app开发工具Kendo UI Web中Grid网格控件的使用的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Quartz快速入门
- 下一篇: 学了C语言,如何利用CURL写一个下载程