checkbox全选、反选。(demo à 表单组件 à多选框/单选框)
<label><input type="checkbox" name="c1" value="1" />选择1</label>
<label><input type="checkbox" name="c1" value="2" />选择2</label>
<label><input type="checkbox" name="c1" value="3" />选择3</label>
<input type="checkbox" class="checkboxCtrl" group="c1" />全选
<button type="button" class="checkboxCtrl" group="c1" selectType="invert">反选</button>
<div id="fileQueue" class="fileQueue"></div>
<input id="testFileInput" type="file" name="image"
uploader="uploadify/scripts/uploadify.swf"
cancelImg="uploadify/cancel.png"
script="ajaxDone.html"
scriptData="{PHPSESSID:'xxx', ajax:1}"
folder="/folder"
fileQueue="fileQueue"
[onComplete="uploadifyComplete"]
[onAllComplete="uploadifyAllComplete"] />
参数说明:
uploader: flash组件uploadify.swf的访问路径
cancelImg: 取消按钮使用的图片路径
script: 服务器端处理上传文件的路径
scriptData:上传文件时需要传递给服务器的其他参数,是json格式
folder: 是服务器存储文件的目录
fileQueue:是上传进度显示区域
onAllComplete:可选参数,单个文件上传完时触发,参数有:
event: event 事件对象
Id: 上传进度队列的id
fileObj: 是一个包含上传文件信息的对象,包括的信息有:
name: 文件名
filePath: 上传文件在服务器端的路径
size: 文件的大小
creationDate:文件创建的时间
modificationDate:文件最后更改的时间
type:是以"."开始的文件扩展名
response:服务器端处理完上传文件后返回的文本
data: 包含有两个参数的对象,
fileCount:上传队列中还剩下的文件数
speed:以KB/s为单位的文件上传平均速度
uploadifyAllComplete:可选参数,全部文件上传完成时调用的函数,参数有:
event:event 事件对象
data: 是一个包含以下信息的对象,
filesUploaded: 已经上传的文件总数
errors: 上传出错的文件总数
allBytesLoaded:已经上传文件的总大小
speed: 以KB/s为单位的上传文件的平均速度
以下3个方法是dwz.ajax.js中定义的用于文件上传的会调函数:
function uploadifyAllComplete(event, data){
if (data.errors) {
var msg = "The total number of files uploaded: "+data.filesUploaded+"\n"
+ "The total number of errors while uploading: "+data.errors+"\n"
+ "The total number of bytes uploaded: "+data.allBytesLoaded+"\n"
+ "The average speed of all uploaded files: "+data.speed;
alert("event:" + event + "\n" + msg);
}
}
function uploadifyComplete(event, queueId, fileObj, response, data){
DWZ.ajaxDone(DWZ.jsonEval(response));
}
function uploadifyError(event, queueId, fileObj, errorObj){
alert("event:" + event + "\nqueueId:" + queueId + "\nfileObj.name:"
+ fileObj.name + "\nerrorObj.type:" + errorObj.type + "\nerrorObj.info:" + errorObj.info);
}
在传统的select 用class 定义:class=”combox”, html 扩展:保留原有属性name, 增加了属性:ref。
ref 属性则是为了做级联定义的,ref所指向的则是当前combox值改变成引起联动的下一级combox,ref用下一级combox的id属性来赋值。
注意:一般combox没必要设置id属性,只要级联时需要设置子级id等于父级ref,不同navTab和dialog中combox组件id必须唯一
以下是级联示例:
<select class="combox" name="province" ref="combox_city" refUrl="city.do?code={value}">
<option value="all">所有省市</option>
<option value="bj">北京</option>
<option value="sh">上海</option>
</select>
<select class="combox" name="city" id="combox_city" ref="combox_area" refUrl=" area.do?code={value}">
<option value="all">所有城市</option>
</select>
<select class="combox" name="area" id="combox_area">
<option value="all">所有区县</option>
</select>
服务器端返回json格式:
[
["all", "所有城市"],
["bj", "北京市"]
]