Dhtmlx TreeGrid中文帮助文档.doc

一 简单TreeGrid的实现 1.导入关键文件 link rel=STYLESHEET type=text/css href=../../../dhtmlxGrid/codebase/dhtmlxgrid.css script src=“../../dhtmlxGrid/codebase/dhtmlxcommon.js/script script src=../../dhtmlxGrid/codebase/dhtmlxgrid.js/script script src=../../dhtmlxGrid/codebase/dhtmlxgridcell.js/script script src=../../dhtmlxTreeGrid/codebase/dhtmlxtreegrid.js/script 2.初始化 div id=gridbox width=100% height=250px style=overflow:hidden/div script mygrid = new dhtmlXGridObject(gridbox); //xml文件中图片的路径 mygrid.setImagePath(%=url%Grid/codebase/imgs/icons_books/; mygrid.setHeader(Tree,Plain Text,Long Text,Color,Checkbox); //列类型（要显示为树行结构第一列必值须为tree，ed为可编辑，txt为文本框…） mygrid.setColTypes(tree,ed,txt,ch,ch); mygrid.init(); mygrid.loadXML(test_list_1.xml); /script 3.基本XML结构（基本机构就是使用row的嵌套达到树形效果） ?xml version=1.0 encoding=UTF-8? rows row id=h1 cell image=folder.gifHonda/cell cell.../cell cell.../cell row id=“c1” cell image=folder.gifHonda/cell cell.../cell cell.../cell row /row /rows 二 关键词定位功能实现说明 （红色部分为关键代码） 引入JS文件，如下： link rel=STYLESHEET type=text/css href=../../../dhtmlxGrid/codebase/dhtmlxgrid.css script src=../../ dhtmlxGrid/codebase/dhtmlxcommon.js/script script src=../../dhtmlxGrid/codebase/dhtmlxgrid.js/script script src=../../dhtmlxGrid/codebase/dhtmlxgridcell.js/script script src=../dhtmlxTreeGrid/codebase/dhtmlxtreegrid.js/script script src=../../dhtmlxGrid/codebase/ext/dhtmlxgrid_filter.js/script script src=../../dhtmlxTreeGrid/codebase/ext/dhtmlxtreegrid_filter.js /script 执行初始化方法如下： div id=gridbox width=100% height=250px style=background-color:white; overflow:hidden /div script //将treeGrid放入id为’gridbox’的div中 mygrid=newdhtmlXGridObject(gridbox); //引入图片 mygrid.setImagePath(../../ext/dhtmlx/dhtmlxGrid/codebase/imgs/icons_books/); //设置表头 mygrid.setHeader(Search, Text Filter, Select Filter); //设置检索类型(有文本框查找，文本框过滤，下拉列表过滤) mygrid.attachHeader(#text_search,#text_filter,#select_filter); //设置单元格的大小 mygrid.setInitWidths(200,100,*); //数据的对齐方式