jQuery EasyUI 数据网格 - 转换 HTML 表格为数据网格

  本实例演示如何转换表格(table)为数据网格(datagrid)。

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。 雷林鹏分享:jQuery EasyUI 数据网格 - 转换 HTML 表格为数据网格 随笔 第1张

  数据网格(datagrid)的列信息是定义在 标记中,数据是定义在 标记中。确保为所有的数据列设置 field 名称,请看下面的实例:

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

Col 1 Col 2 Col 3 Col 4 Col 5 Col 6
Data 1 Data 2 Data 3 Data 4 Data 5 Data 6
Data 1 Data 2 Data 3 Data 4 Data 5 Data 6
Data 1 Data 2 Data 3 Data 4 Data 5 Data 6
Data 1 Data 2 Data 3 Data 4 Data 5 Data 6

  非常棒,您可以定义一个复杂的表头,例如:

  

  

  Col 1

  Col 2

  Col 3

  Details

  

  

  Col 4

  Col 5

  Col 6

  

  

  现在您可以看见,复杂表头已经创建。

雷林鹏分享:jQuery EasyUI 数据网格 - 转换 HTML 表格为数据网格 随笔 第2张

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid1.zip

  本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄