DHTMLX组件新版本培训

1、n1、版本信息n2、主要新功能n3、新功能使用举例n4、其他组件说明n5、一些需要注意的问题n6、总结DHMTLX组件名称组件名称 版本版本 推荐样式推荐样式(默认默认)Grid1.6grayToolbar2.6dhx_skyblueLayout2.6dhx_skyblueWindow2.6dhx_skyblueTabbar2.6dhx_skyblueTree1.6defaultnGridn冻结列n标题合并n内容列合并，行合并n支持Excel方式录入数据n其他功能nWindown窗口组件，里面可以连接生成各种组件或HTML页面，可以用来创建查询，选项界面。nLayoutn布局组件，通过嵌套布局

2、组件，可以实现复杂的用户界面，并且各个布局的板块的尺寸可以通过代码动态调整。n冻结列n需要引入的文件：dhtmlxgrid_splt.jsn作用：在初始化Grid时，把从左往右数的若干列冻结（类似Excel的冻结功能）n代码：调用Grid的splitAt(列索引)方法;如：mygridPro.splitAt(2);n注意事项： 应在Grid的init()方法之后调用此方法，否则会报错。n缺点：只能在Grid初始化时确定冻结的列，Grid生成之后不能改变。n标题合并n作用：通过标题合并功能，可以设置复杂的标题n使用方法：n第一行标题使用原来的方法grid.setHeader();n第二行开始使用

3、grid.attachHeader();n例子：ngrid.setHeader( Column1,#cspan,#cspan); grid.attachHeader( Column11, Column12,#cspan);n对应的格式如下：Column1Column11Column12Data1Data2Data3n内容列合并，行合并n行合并需要引入的文件：dhtmlxgrid_rowspan.jsn首先在grid初始化时调用enableRowspan()，允许行合并；或者enableCollSpan(true)，允许列合并。n然后在XML中设置数据格式n行合并：合并开始行Value，其他合并

4、的行对应的列n列合并：合并开始类Value，其他合并的列n例子：见工程n支持Excel方式录入数据nGrid初始化时调用enableKeyboardSupport(true)n需要引入文件：dhtmlxgrid_keymap_excel.jsn类似Excel的录入方式，使用方向键和Enter键进行数据录入n其他功能n1. 分页nGrid初始化时调用enablePaging(mode,pageSize,pagesInGrp,pagingControlsContainer,showRecInfo,pagingStateContainer)n需要引入文件：dhtmlxgrid_pgn.jsn例子my

5、grid.enablePaging(true,40,5,pagingArea,true,infoArea);n2. 日期控件n列的类型设为：dhxCalendar(只读), dhxCalendarA(可编辑)n需要引入的文件：ndhtmlxcalendar.css，dhtmlxcalendar_yahoolike.css，ndhtmlxcalendar.js，dhtmlxgrid_excell_dhxcalendar.jsnGrid初始化时调用：mygrid.setDateFormat(%m/%d/%Y);n其他功能n3. 日期时间n列的类型设置为：datetimen需要引入的文件：js/da

6、tetime_cell.js, dhtmlxgrid_excell_datetime.jsn4. 多选类型的列n列的类型设置为：clistn需要引入的文件：dhtmlxgrid_excell_clist.jsn使用方法：在grid初始化的时候，设置可选值：ngrid.registerCList(row index, value Array);ngrid.registerCList(8, GME, DMC, SME,SYE,MAS);n更多详细功能的使用请参考API或在线例子nAPI：group-itIndividualWang xiaorundhtmlx.chm （DM

7、C）或 03git_otdhtmlx.chm （GME）nDHTMLX在线例子：http:/ crTool.attachEvent(onClick,onButtonClickCr);n旧方式：seaTool.setOnClickHandler(onButtonClickSea);n2、在同一页面使用组件时，需要多次新建和关闭，建议组件所使用的DIV采取动态新增方式，同时在不使用组件时（如Window组件）调用组件的销毁方法（一般是unload），以及时释放内存。nvar newDiv = document.createElement(DIV); document.body.appendChild(newDiv); newDiv.innerHTML=initCrDiv();initCrDiv()是生成一个用字符串表示的HTML代码的函数。n3、获取Grid的xmlStri