SoTower WEB组件开发指南.doc

SoTower-WEB组件开发指南版本号 V1.5北京中电普华信息技术有限公司2008-03-27 SoTower用户手册 修订历史版本号修改人修改日期摘 要V1.0刘少壮2007-06-01创建文档V1.5张继杰2008-03-07修改文档V1.5尚枫2008-03-11修改文档版权所有2005-2008 北京中电普华信息技术有限公司目 录1前言11.1概述11.2参考资料11.3HTML组件11.3.1概述11.3.2Button（按钮）标签21.3.3cancel（取消）组件31.3.4submit（提交)组件51.3.5reset（重置按钮）组件61.3.6checkbox（复选框）组件81.3.7radio（单选框）组件101.3.8text（文本框）组件111.3.9password（密码框）组件131.3.10hidden（隐藏域）组件151.3.11file（上传）组件171.3.12textarea（文本区）组件191.3.13label（标签）组件201.3.14checkboxGroup（复选框组合）组件211.3.15radioGroup（单选框组和）组件241.3.16form（表单）组件261.3.17select（下拉框）组件271.3.18multiSelect（联动下拉框）组件311.3.19错误标签331.3.20消息标签331.4日期组件(date)341.4.1概述341.4.2年月日，年月日时间341.4.3年月组件371.4.4时间组件371.4.5年组件371.5树型组件(seltree)381.5.1概述381.5.2多阶段取数据树391.5.3排序树(一次性取数据树)461.5.4多选树，单选树481.5.5链接树481.6编辑网格组件(Editgrid)491.7查询网格组件(FlexGrid)621.8Tab页组件(tab)831.8.1概述831.8.2Tab页组件831.9菜单组件(Menu5)911.9.1概述911.9.2菜单组件911.9.3菜单数据结构931.10Loading组件(loading)951.10.1概述951.10.2Loading组件951.11颜色选择器组件(colorSelector)971.11.1概述971.11.2颜色选择器组件971.12列表(list)981.12.1移动列表981.12.2排序列表1041.13资源定位器(ui)1071.13.1概述1071.13.2配置资源前置路径1071.13.3JSP页面文件头部引入sotower标签库1071.13.4JSP页面中使用ui标签引入images,js,css文件1071.13.5SkinUtils类以及方法说明1081.14容器(container)1091.15comb(组合框)组件1101.16微调(inch)组件1111.17帮助（异步取数据）组件1121.18Flash图表1141.19公共JavaScript函数118120版权所有2005-2008 北京中电普华信息技术有限公司SoTower WEB组件开发指南1 前言1.1 概述美观的界面，统一的风格，丰富的用户体验是每一款优秀的软件产品所追求的。完善的客户端可以大大提高用户对软件的满意程度。近年来，与客户端相关的技术不断发展，从最早的瘦客户端模式，到后来的胖客户端，再到最近流行的富客户端，软件的客户端越来越被人们重视，在软件产品中的比重也越来越大。但客户端的开发效率一直被开发人员所担忧。我们SoTower Web组件经过不断创新，利用领先的技术，开发出成熟完善的客户端解决方案。可以非常轻松的搭建出令人耳目一新的，具有RIA (Rich Internet Application) 特征的Web应用界面。SoTower Web组件运用jsp标签技术，巧妙的整合后台数据与前端html、css、javascript、flash等，构造出各种丰富的组件，如：网格、树、图表、日历、菜单等等。无需下载安装任何浏览器插件， 即能拥有丰富的用户体验和美观的界面。1.2 参考资料SoTower1.5框架开发指南组件开发1.3 HTML组件1.3.1 概述HTML组件是用jsp标签技术，将html中的普通控件、css样式、javascript事件包装在一起，通过配置属性，就能获得request对应的值。风格统一，简化开发，可重用。HTML组件包括button、text、password、hidden、checkbox、radio、checkbox组、radio组、textarea、lable、file、submit、cancel、reset、select等等。使用HTML组件需要先引入web-html.tld和skin.csslink rel=stylesheet type=text/css href=1.3.2 Button（按钮）标签button标签输出的html代码是在html里面的的基础上添加了一个onmouseover和onmouseout事件，两个事件中分别改变按钮的样式，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-1属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY按钮名称StyleN按钮的样式styleClassN按钮的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY按钮的显示文本1.3.3 cancel（取消）组件cancel标签输出的html代码是在html里面的的基础上添加了onmouseover和onmouseout事件，两个事件中分别改变按钮的样式，还有submit按钮的文本指定是cancel了，不能更改。具体属性也同html中的相同。使用标签实例：标签输出html：标签属性如下：表2-2属性默认值是否标签属性和必须描述Accesskey N设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY按钮名称StyleN按钮的样式styleClassN按钮的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY按钮的显示文本，固定为cancel，不能更改1.3.4 submit（提交)组件submit标签输出的html代码是在html里面的的基础上添加了onmouseover和onmouseout事件，两个事件中分别改变按钮的样式，具体属性也同html中的相同。使用标签实例：标签输出html：标签属性如下：表2-3属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY按钮名称StyleN按钮的样式styleClassN按钮的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY按钮的显示文本1.3.5 reset（重置按钮）组件reset标签输出的html代码是在html里面的的基础上添加了onmouseover和onmouseout事件，两个事件中分别改变按钮的样式，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-4属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY按钮名称StyleN按钮的样式styleClassN按钮的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)。titleKeyN目前未使用ValueY按钮的显示文本1.3.6 checkbox（复选框）组件checkbox标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-5属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键。AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.data1.3.7 radio（单选框）组件radio标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-6属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.data1.3.8 text（文本框）组件text标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-7属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.dataSizeN域长度MaxlengthN最大输入字符数1.3.9 password（密码框）组件password标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-8属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.dataMaxlengthN最大输入字符数SizeN域长度1.3.10 hidden（隐藏域）组件hidden标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：2标签属性如下：表2-9属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.dataWriteFalseN是否在隐藏域后面显示隐藏域的值1.3.11 file（上传）组件file标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例：标签输出html：标签属性如下：表2-10属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY上传框的value不能赋值，故value属性不起作用1.3.12 textarea（文本区）组件textarea标签输出的html代码与html里面的相同，具体属性也与html中的相同。使用标签实例： 标签输出html：web-html组件-html组件标签属性如下：表2-11属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键。AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得焦点时触发OnkeydownN当用户按下键盘按键时触发OnkeypressN当用户按下字面键时触发OnkeyupN当用户释放键盘按键时触发onmousedownN当用户用任何鼠标按钮单击对象时触发onmousemoveN当用户将鼠标划过对象时触发OnmouseoutN当用户将鼠标指针移出对象边界时触发OnmouseoverN当用户将鼠标指针移动到对象内时触发OnmouseupN当用户在鼠标位于对象之上时释放鼠标按钮时触发NameY控件名称StyleN控件的样式styleClassN控件的样式表名称styleIdN目前未使用TabindexN设置或获取定义对象的 Tab 顺序的索引TitleN设置或获取对象的咨询信息(工具提示)titleKeyN目前未使用ValueY控件的valuePropertyN从view中取属性名为property的值。对应的数据类型可以是map或javabeanbeanNameN指定要从request中取值的view的名称，默认为html.data1.3.13 label（标签）组件label标签是根据标签配置的属性名，取request中的集合（list），集合中的map或javaben中对应的值的。输出的html代码是一个隐藏域后加上文字，外面包一个span。使用标签实例：标签输出html：value2标签属性如下：表2-12属性默认值是否标签属性和必须描述VisibleTrueN是否隐藏。CollectionN对应request中集合的名称。labelPropertyN集合中的map或javabean作为标题显示的属性名称labelKeyN集合中的map或javabean作为隐藏域value的属性名称NameY控件名称1.3.14 checkboxGroup（复选框组合）组件checkboxGroup标签根据request集合（list）的长度生成对应数量的html中的checkbox。每个checkbox的name相同，值和显示文本对应集合的一项map或javabean。使用标签实例：标签输出html：value1value2标签属性如下：表2-13属性默认值是否标签属性和必须描述AccesskeyN设置或获取对象的快捷键AltN设置或获取用于替代图像的文本altKeyN设置或获取 Alt 键的状态DisabledN设置或获取控件是否可用IndexedN目前不可用OnblurN在对象失去输入焦点时触发的事件OnchangeN当对象或选中区的内容改变时触发OnclickN用鼠标左键单击对象时触发OndblclickN双击对象时触发OnfocusN当对象获得