dhtmlx中文使用手册API指南Word文件下载.doc
《dhtmlx中文使用手册API指南Word文件下载.doc》由会员分享，可在线阅读，更多相关《dhtmlx中文使用手册API指南Word文件下载.doc（174页珍藏版）》请在冰点文库上搜索。
3.2.7群组扩充 31
4dhtmlxEditor指南与程序代码范例 32
4.1什么是dhtmlxEditor 32
4.1.1主要功能 32
4.1.2支持的浏览器 32
4.2使用接口 32
4.2.1工具列 33
4.2.2编辑区 33
4.3dhtmlxEditor的运作 33
4.3.1文字格式 33
4.4初始化dhtmlxEditor 34
4.5可用Skins 35
4.6API函式 35
5dhtmlxLayout指南与程序代码范例 36
5.1什么是dhtmlxLayout 36
5.1.1主要功能 36
5.1.2支持浏览器 37
5.2dhtmlxLayout初始化 37
5.2.1对象型初始化 38
5.2.2窗口型初始化 39
5.2.3全屏幕的初始化 39
5.2.4版格型初始化 39
5.3全域性项目 40
5.3.1增加选单 40
5.3.2增加工具列 41
5.3.3增加状幠列 41
5.4dhtmlxLayout组幠 42
5.4.1可使用的Skin 42
5.4.2设定样式 43
5.4.3自动尓寸 45
启动/停用效果 45
5.5项目操作 46
5.5.1项目存取 46
5.5.2Id-索尙的互相连结 47
5.5.3迭代器（Iterator） 47
5.5.4表头操作 47
5.5.5项目的扩展或折迭 48
5.5.6窗口的停驻或项目的停驻 49
5.5.7项目的尓寸 49
5.5.8附加对象 49
5.5.9附加URL 50
5.5.10固定格子尓寸 50
5.6事件处理 50
5.6.1附加事件处理函式 51
5.6.2onDock和onUndock事件 51
5.6.3onResizeFinish事件 52
5.6.4onExpand事件 52
5.6.5onCollapse事件 52
5.7附加DHTMLX组件 52
5.7.1附加组件到完整的版面 52
5.7.2附加组件到版面项目 53
5.7.3附加树 53
5.7.4附近其它的dhtmlx组件 53
6dhtmlxMenu2.0指南与程序代码范例 54
6.1什么是dhtmlxMenu 54
6.1.1主要功能 54
6.1.2支持的浏览器 55
6.2dhtmlxMenu2.0初始化 55
6.2.1新选单对象的建立 55
6.2.2设定图文件路径 57
6.2.3设定Skin 57
6.2.4数据加载 62
6.2.5全域性的参数 64
6.3项目设定的操作 66
6.3.1建立Sibling项目 66
6.3.2建立新的子项目 66
6.3.3建立新的分隔线 67
6.3.4移除项目 67
6.3.5取得ParentId 67
6.3.6启用/停用项目 68
6.3.7显示/隐藏项目 68
6.3.8设定项目的文字 68
6.3.9设定项目的位置 69
6.3.10设定开发员的数据 69
6.3.11设定项目的图片 70
6.3.12设定项目的工具提示 70
6.3.13设定项目的热键 71
6.3.14建立选取方格 71
6.3.15建立单选按钮 72
6.4事件处理 73
6.4.1可使用的事件 73
6.4.2附加一个事件处理 73
6.4.3onClick和onTouch事件 73
6.4.4onCheckboxClick事件 74
6.4.5onRadioClick事件 74
6.4.6onXLS事件 75
6.4.7onXLE事件 75
6.4.8onBeforeContextMenu事件 76
6.4.9onAfterContextMenu事件 76
6.5XML格式模板 76
7dhtmlxTabBar指南与程序代码范例 78
7.1 什么是dhtmlxTabBar 78
7.1.1主要功能 78
7.1支持浏览器 78
7.2dhtmlxTabBar的运作 79
7.2.1自javascript建构式初始TabBar对象 79
7.2.2依据HTML结构初始TabBar对象 79
7.2.3以Javascript建立tabbar 80
7.2.4自XML建立tabbar 80
7.2.5用Javascript指派页签的内容 82
7.2.6用XML指派页签的内容 82
7.2.7载入IFrames的内容 83
7.2.8以AJAX下载内容 84
7.2.9混合加载模式 84
7.2.10设定：
位置、排列、位移、边界 85
7.2.11Skin：
颜色、预定的skin 85
7.2.12正规化 86
7.2.13管理tabbar和tab内容区域的大小 86
7.2.14以API管理每一个tab 87
8dhtmlxToolbar指南与程序代码范例 88
8.1什么是dhtmlxToolbar 88
8.1.1主要特点 88
8.1.2支持的浏览器 89
8.2dhtmlxToolbar的选项种类 89
8.3初始化dhtmlxToolbar 89
8.3.1建立新网页曐幅对象 89
8.3.2设定影像路径 90
8.4加载数据 90
8.4.1由XML档案加载数据 91
8.4.2由XML字符串加载数据 91
8.4.3由Script加载数据 91
8.4.4onLoadFunction 92
8.5增加和删除选项 92
8.5.1增加按钮 92
8.5.2增加文字选项 92
8.5.3增加选择按钮 93
8.5.4增加双幠按钮 94
8.5.5增加分隔线 94
8.5.6增加滑动棒 94
8.5.7增加输入区 95
8.5.8删除选项 95
8.6设定选项 96
8.6.1迭代器 96
8.6.2适用任何选项 96
8.6.3按钮 97
8.6.4选择按钮 99
8.6.5双幠按钮 103
8.6.6文字选项 104
8.6.7分隔线 104
8.6.8滑动棒 104
8.6.9输入区选项 106
8.7事件处理 107
8.7.1可用的事件 107
8.7.2增添事件处理例程 107
8.7.3onClick事件 108
8.7.4onStateChange事件 108
8.7.5onValueChange事件 108
8.7.6onXLS事件 109
8.7.7onXLE事件 109
8.7.8onEnter事件 109
8.8XML格式模版 109
9dhtmlxTree指南与程序代码范例 111
9.1什么是dhtmlxTree 111
9.1.1主要功能 111
9.1.2支持浏览器 112
9.2dhtmlxTree的运作方式 112
9.2.1网页初始化 112
9.2.2事件处理 113
9.2.3透过Script新增节点 113
9.2.4使用XML加载数据 114
9.2.5自订节点的图示 115
9.2.6使用动幠加载的树状元件 116
9.2.7节点的操作 116
9.2.8序列化树状元件 117
9.2.9节点提示 117
9.2.10节点的移动 117
9.2.11子节点的笔数 118
9.2.12智能型XML解译 119
9.2.13树的选取盒 119
9.2.14树的单选按钮 119
9.2.16增加效能 120
9.2.17弹跳式选单 121
9.2.18HTTPS兼容性 121
9.2.19整新载入节点 122
9.2.20节点的排序 122
9.2.21搜寻功能 122
9.2.22多行显示项目 123
9.2.23图示 123
9.2.24按键的操作 123
9.2.25分布式解译 124
9.2.26错误处理 124
9.2.27节点编辑 128
9.2.28服务器端的同步更新 128
9.2.29在网页中初始化 130
9.2.30智能型呈现（SmartRendering） 131
10dhtmlxGrid指南与程序代码范例 133
10.1什么是dhtmlxGrid 133
10.1.1主要功能 133
10.1.21.5版提供的新功能 133
10.1.3支持浏览器 134
10.2dhtmlXGrid的运作方式 134
10.2.1按键操作 134
10.2.2在网页上初始化组件 134
10.2.3事件处理函式 135
10.2.4使用Script新增数据列 136
10.2.5使用XML加载数据 136
10.2.6使用Script新增节点数据列（TreeGrid） 138
10.2.7序列化组件 138
10.2.8卷动时的动幠载入 139
10.2.9数据列的操作 139
10.2.10数据列的移动 139
10.2.11弹跳式选单 139
10.2.12TreeGridXML结构 141
10.2.13智能型XML解译（只适用在TreeGrid） 141
10.2.14选取盒与单选按钮 141
10.2.15增加效能 142
10.2.16分布式解译 142
10.2.17多行的资料列 142
10.2.18多选模式 142
10.2.19拖放功能 142
10.2.20延伸的拖放模式 143
10.2.21数学公式 143
10.2.22TreeGrid的公式设定 144
10.2.23鼠标尙导模式 144
10.2.24透过XML设定 144
10.2.25与dhtmlxTree互动（组件之间的拖放） 146
10.2.26使用编辑器（eXcell） 147
10.2.27连结服务器端的数据处理 148
10.2.28树状元件与数据方格组件的初始化及使用方式 152
10.2.29定义新的编辑器（eXcell） 153
10.2.30分页输出 156
10.2.31智能型呈现 157
10.2.32合并储存格 158
10.2.33分割模式与冻结字段 159
10.2.34表头图示 159
10.2.35treeGrid的动幠载入 160
10.2.36新增/删除/移动字段 160
10.2.37汇出/汇入CSV 161
10.2.38复制数据到Excel（剪贴簿的操作） 161
10.2.39设定储存格类型 162
10.2.40多行表头／表尾 162
10.2.41储存／还原字段的宽度 164
10.2.42由网页表格初始化 165
10.2.43dhtmlxTreeGrid的智能型解译 166
10.2.44Skins 166
10.2.45筛选 166
10.2.46一次筛选多值 167
10.2.47在表头上加上筛选 167
10.2.48群组 168
10.2.49延伸应用 168
10.2.50节点之间的线呈现方式 169
10.2.51在巢状的数据方块新增子数据列 169
10.2.52数据透视表 169
10.2.53自动计算表头与表尾的值 170
10.2.54"
FAST"
模式的相关操作 170
11hyProgressBar指南与程序代码范例 171
11.1什么是hyProgressBar 171
11.1.1主要功能 171
11.1.2支持浏览器 171
11.1.3初始化hyProgressBar 171
ll.l.3.l.自动产生myProgressBarHandler集合对象（预设） 171
1前言（Introduction）
1.1目的（Purpose）
本使用尝册目的是配合研考会共享服务组件开发项目，针对「服务开发者」操作DHTMLX组件而撰写，DHTMLX是一套网页开发的函式库，他提供了树状元件、数据方格组件、工具列等组件供开发人员使用；
避免重复撰写组件，缩短开发时间，目的在让开发者充分了解组件的每项功能，同时也让开发者能够迅速并容易地操作这些元件。
本文件系根据DHTMLX在线说明，开发人员也可直接使用组件的在线说明功能。
1.2范围（Scope）
根据上述目标，本文件范围主要描述以DHTMLX公司所提供的开源函式库，此函式库包含dhtmlxCalendar、dhtmlxCombo、dhtmlxEditor、dhtmlxLayout、dhtmlxMenu、dhtmlxTabBar、dhtmlxToolbar、dhtmlxTree、dhtmlxGrid、共九个组件，并加入凌网自行开发之hyProgressBar共十个组件，所代表的意义请见下一节说明。
1.3名词定义（Definition）
名词
解释
dhtmlxCombo
窗体输入组件，提供自动完成，数据选取等整合表单功能。
dhtmlxEditor
网页编辑器，包含了一般桌面编辑器具备的功能提供使用者更丰富的编辑环境。
dhtmlxLayout
版型定义组件，提供将数个不同项目组合成单一版面的简易方式。
此组件富弹性并容易使用，还有各种预先定义版面样式帮开发者节省设定的时间。
dhtmlxMenu
选单元件，提供下拉式、上下文或弹跳式选单，有助于网站的指尙、系统说明等等。
dhtmlxTabBar
页签组件，提供分页信息，分页浏览等功能，有助于网站信息的整合分类。
dhtmlxToolbar
工具列组件，提供多项工具列按钮，以及曐式与直式的显示，达到网站功能性分类的目的。
dhtmlxTree
树状元件，提供数据分类显示，数据延迟加载的功能以及数据选取的功能，提供开发者良好的数据显示方式以及对巨量资料的处理方法。
dhtmlxGrid
数据方格组件，提供开发者类似MSEXCEL的元件，可以显示数据与编辑数据，也可以让网站使用者有良好的使用者界面。
Hyweb
ProgressBar
透过进度列显示出操作的完成进度状幠，并且可以支持参数对象（JSON）定义其样式与显示的图标。
进度的显示方式有完成百分比（%）的文字显示。
进度列组件并且支持通知，透过设定触发条件当进度达到触发条件，将会触发事件提供给网页应用程序开发人员对事件进行操作与处理。
1.4参考文件（References）
本文件系根据DHTMLX在线说明，经繁体中文化而成项目工作计划书V2.0.0
软件需求规格书V3.0.0
DHTMLX官方网站信息及在线说明文件
（
2dhtmlxCalendar指南与程序代码范例
呈现组件提供开发者一套相同的开发模式，对于组件的使用有相同或类似的呼叫方式，以及易于客制呈现的画面，基于上述原则，呈现组件应该具备下列条件：
（1）呈现组件是一套Javascript函式库。
（2）使用时需要复制相关档案于开发目录中，再依据各个组件的呼叫方式使用。
（3）各个呈现组件提供标准的CSS与图式集，开发人员亦可以自行定义新的CSS。
（4）各个呈现组件在设定上皆使用XML标准格式设定文件。
DHTMLX开源的组件部分符合了这几个要点，开发者可以透过JavaScript,XML或HTML元素初始化的方式初始组件，也可以根据CSS规格客制组件的呈现方式，并且不相依于其它开源函式库，所以安装简易方便（只要复制到网站的目录即可开发）。
除了这些共通性质之外，每一个组件的特性功能并不一样，而这些详细的功能特性会在往后的章节详述。
2.1什么是dhtmlxCalendar
dhtmlxCalendar是一个可以弹出日期选取器或是呈现平面日历的组件。
对于开发者的网站或应用程序而言，dhtmlxCalendar确实是一个易于使用，并可充分客制适合不同需求的日期选取器方案。
这个日历支持在日期选择上的各种功能，如设定自订的日期格式、使用不同的语言和套版、以及其它不同的功能等。
完整的JavaScriptAPI提供开发者节省时间的设定。
dhtmlxCalendar为开发者提供以下的可能性：
任一日期（如:
周日或周一）都可为一周中的第一天;
使用年份下拉列表;
设定日期格式;
启用日期范围选择;
支持多语系的日历功能;
设定假日。
2.1.1主要特点
支持多浏览器/支持跨平台;
可以JavaScriptAPI完全控制;
设定无效的日期范围;
内建多语系支持;
易于连结至文字输入字段;
双日历。
2.1.2支持的浏览器
IE5.5以上;
MacOSXSafari;
Mozilla1.4以上;
FireFox0.9以上。
GoogleChrome。
Opera8.5以上。
2.2初始化dhtmlxCalendar
下列初始化方式可供dhtmlxCalendar开发者使用：
最小初始化;
延展型初始化;
与输入连结的日历;
任一种dhtmlxCalendar初始化必须做的第一件事如下：
从Server下载dhtmlxCalendar包，并放置在某一数据夹;
建立一份HTML文件;
将dhtmlxCalendar的CSS文件和JS文件的完整路径放到建立的HTML文件檔头。
<
head>
linkrel="
stylesheet"
type="
text/css"
href="
[档案的完整路径]/dhtmlxcalendar.css"
>
scriptsrc="
[档案的完整路径]/dhtmlxcommon.js"
/script>
[档案的完整路径]/dhtmlxcalendar.js"
script>
window.dhx_globalImgPath="
[目录的完整路径]/codebase/imgs/"
;
//用来设定日历图文件所在目录之完整路径的JS全域变数
/head>
2.2.1最小初始化
首先，开发者必须建立一个放置dhtmlxCalendar的对象。
在这个例子中，这个对象是放置在<
body>
卷标（对象）中的一个<
div>
元素：
divid="
objId"
/div>
下一步将建立一个新的dhtmlxCalendarObject，并将其放置在我们刚刚建立的<
元素（对象）之后：
mCal=newdhtmlxCalendarObject（"
true）;
开发者应指定的参数如下：
objId-要建立Calendar之对象的ID;
true|false-强制显示或不立刻显示日历。
还要再加上最后一个初始化Calendar的指令如下：
mCal.draw（）;
当网页被加载后，日历即会被显示在页面上，并标出目前日期。
注意：
当初始化Calendar时，开发者应决定是否透过建构式的第二个参数（设为true），或使用draw（）方法来显示日历。
2.2.2延展型初始化
以延展型初始化建立Calendar时，开发者用的也是跟最小初始化相同的指令来呼叫。
延展型初始化的程序代码如下所示：
false,
{name_of_the_option:
parameter}）;
建构式的第三个参数允许开发者启用Calendar的不同选项：
isYearEditable:
true|false-允许开发员直接用键盘输入年份；
yearsRange:
（[from,to]）-提供年度范围的设定（数组[from,to]）；
isMonthEditable:
（true|false）-允许开发员直接用键盘输入月份；
isWinHeader:
（frue|false）-将窗口标头显示成按钮（关郓，最大化/最小化，设定目前日期）和“日历标题”标签；
headerButtons:
"
XMT"
-使用哪些标头按钮：
关闭（X），最大化/最小化（M），设置目前日期（T）；
isWinDrag:
（frue|false）-若设其为true（而且isWinHeader也设为true），则允许日历可被拖拉。
如果开发者打算一次设置上述多个选项，可将相关指令以逗号分隔写在一起（作为建构式的第三个参数）。
2.2.3日历连结输入栏
还可以建立一个Calendar连结到页面的输入栏。
首先，开发者应先建立输入栏。
例如：
升级会员 