dhtmlxgrid使用基础

目录

1. 包含的javascript文件

2. 初始化grid

3. 数据来源于外部XML文件

4. 数据来源于本页XML数据岛

---

dhtmlxgrid用于显示表格，相关官方资料可参阅http://www.dhtmlx.com/

1. 包含的javascript文件（回目录）

<script type="text/javascript" src="jquery.js"></script>
<link rel="STYLESHEET" type="text/css" href="dhtmlxgrid.css">
<script type="text/javascript" src="dhtmlxcommon.js"></script>
<script type="text/javascript" src="dhtmlxgrid.js"></script>
<script type="text/javascript" src="dhtmlxgridcell.js"></script>

2. 初始化grid代码（回目录）

mygrid = new dhtmlXGridObject('dataTable');
mygrid.setImagePath("/imgs/");
mygrid.setHeader("第1列标题,第2列标题");　　// 列标题用逗号隔开
mygrid.setInitWidths("100,*");　　　　　　 // 各列宽度数字表示像素，弹性用*表示
mygrid.setColAlign("center,left");
mygrid.setSkin("light");
mygrid.enableAutoHeight(true);
mygrid.init();

 其中，在页面上先放一个表格容器：

<DIV id="dataTable"></DIV>

3. 数据来源于外部XML文件（回目录）

初始化grid后，就可以从外部XML文件装入数据并在表格上显示：

mygrid.loadXML("data.xml");

4. 数据来源于本页XML数据岛（回目录）

如果数据来自于本页中的XML数据岛，形如：

<xml id=dataXML>
  <rows>
     <row id=1>
       <cell>cell11</cell>
       <cell>cell12</cell>
     </row>
     <row id=2>
       <cell>cell21</cell>
       <cell>cell22</cell>
     </row>
   </rows>
</xml>

则装入数据的javascript代码将是

mygrid.parse($("#dataXML")[0]);