jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解的只有一些简单的html标签。 本经验是 【jQuery EasyUI从入门到精通】系列教程的第18部分,在第17部分基础上,继续讲述 jQuery EasyUI Web Demos之DataGrid(数据表格)。
工具/原料
1
笔记本电脑或是台式机
2
互联网
3
jQuery EasyUI
4
DataGrid(数据表格)
方法/步骤
1Cell Editing in DataGrid - jQuery EasyUI Demo
Cell Editing in DataGrid(数据表格的单元格编辑),Click a cell to start editing.
Cell Editing in DataGrid
Click a cell to start editing.
| Item ID | Product | List Price | Unit Cost | Attribute | Status |
|---|
2
Cell Editing in DataGrid(数据表格的单元格编辑),运行效果如下图所示。
4
Cache Editor for DataGrid(数据表格的编辑缓存),Javascript代码如下图所示。
5
Cache Editor for DataGrid(数据表格的编辑缓存),运行效果如下图所示。
6DataGrid Row Style - jQuery EasyUI Demo
DataGrid Row Style(数据表格的行风格),The rows which listprice value is less than 30 are highlighted.
DataGrid Row Style
The rows which listprice value is less than 30 are highlighted.
| Item ID | Product | List Price | Unit Cost | Attribute | Status |
|---|
7
DataGrid Row Style(数据表格的行风格),运行效果如下图所示。
注意事项
jQuery EasyUI插件依赖于JQuery,需要在easyui.min.js之前引入JQuery库
上一篇:Java JTable的使用
下一篇:非常简单的五花肉腐竹煲
