DWZ富客户端框架使用手册

DWZ富客户端框架使用手册目录概述设计思路学习DWZ的建议DWZ区别于其它JS框架，最大的优点版权声明DWZ团队介绍HTML扩展Ajax链接扩展当前navTab中链接ajaxpost扩展dialog链接扩展navTab链接扩展Tab组件扩展Accordion组件容器高度自适应CSSTableTable扩展在线编辑器分页组件ajaxTodo扩展dwzExport列表数据导出Inputalt扩展Tree扩展Panel扩展日历控件url变量替换checkbox全选、反选uploadify多文件上传combox组件suggest+lookup+主从结构查找带回主从结构Ajax表单表单查询普通Ajax表单提交服务器端响应文件上传表单提交服务器端响应Java服务器端表单处理示例DWZjs库介绍DWZ框架初始化dwz.core.jsdwz.ui.jsdwz.ajax.jsdwz.alertMsg.jsdwz.jDialog.jsdwz.accordion.jsdwz.barDrag.jsdwz.navTab.jsdwz.scrollCenter.jsdwz.stable.jsdwz.cssTable.jsdwz.tree.jsdwz.theme.jsdwz.validate.method.jsdwz.validate.zh.jsdwz.contextmenu.jsdwz.pagination.jsdwz.database.jsdwz.datepicker.jsdwz.combox.jsdwz.checkbox.jsdwz.uitl.date.jsdwz.regional.zh.jsdwz.validate.method.jsJavascript混淆和压缩Javascript混淆Javascript用gzip压缩DWZ如何中使用打包的js常见问题及解决ErrorloadingXMLdocument:dwz.frag.xmlIIS不能用Ajax访问*.htm或是*.html后缀的页面多个navTab页面或dialog页面ID冲突，解决方法jQuery1.4.2和jquery.validate.js在IE的兼容问题升级jQuery1.4.2注意事项weblogic访问xml问题如何自定义DWZ分页参数参数如何关闭loadingDWZ局部刷新怎样做?DWZ版本升级版本命名规则V1.3FinalV1.3RC4V1.3RC3V1.3RC2V1.3RC1V1.2FinalV1.2RC1V1.1.6FinalV1.1.6RC3V1.1.6RC2V1.1.6RC1V1.1.5FinalV1.1.5RC3V1.1.5RC2V1.1.5RC1V1.1.5Beta1V1.1.4FinalV1.1.3V1.1.2V1.1.1v1.1.0v1.0.6v1.0.5附录附录一Firebug介绍补充说明和常见问题(xiaosuiba)概述DWZ富客户端框架(jQueryRIAframework),是中国人自己开发的基于jQuery实现的AjaxRIA开源框架.DWZ富客户端框架设计目标是简单实用、扩展方便、快速开发、RIA思路、轻量级DWZ框架支持用html扩展的方式来代替javascript代码,只要懂html语法,再参考DWZ使用手册就可以做ajax开发.开发人员不写javascript的情况下,也能用ajax做项目和使用各种UI组件.基本可以保证程序员不懂javascript,也能使用各种页面组件和ajax技术.如果有特定需求也可以扩展DWZ做定制化开化.做ajax项目时需要写大量的javascript才能达到满意的效果.国内很多程序员javascript不熟,大大影响了开发速度.使用DWZ框架自动邦定javascript效果.不需要开发人员去关心javascript怎么写,只要写标准html就可以了.DWZ简单扩展了html标准,给HTML定义了一些特别的class和attribute.DWZ框架会找到当前请求结果中的那些特别的class和attribute,并自动关联上相应的js处理事件和效果.DWZ基于jQuery可以非常方便的定制特定需求的UI组件,并以jQuery插件的形式发布出来.如有需要也可做定制化开发.欢迎大家提出建议,我们将在下一版本中进一步调整和完善功能．DWZ富客户端框架是开源项目,可以免费获取源码.希望有多的开发人员使用,共同推进国内整体ajax开发水平.在线演示地址下载:设计思路第一次打开页面时载入界面到客户端,之后和服务器的交互只是数据交互,不占用界面相关的网络流量.支持HTML扩展方式来调用DWZ组件.标准化Ajax开发,降低Ajax开发成本.学习DWZ的建议刚接触DWZ的人可能感觉DWZ文档太少、入门困难，原因都是没有掌握正确的学方法。建议按下面的步骤来学习DWZ框架：通读DWZ文档，很多新手提的问题文档中都写了。看demo每个组件演示效果和代码（留意组件html结构）。建议安装firebug，用firebug看html结构、CSS和调试JS都非常方便。见附录一firebug介绍。对于初学者不建议看DWZ全部源码，但还是非常有必要看看dwz.ui.js和dwz.ajax.js可以从googlecode下载dwz_thinkphp版本，结合php后台去理解DWZ和服务器端的交互方式DWZ区别于其它JS框架，最大的优点完全开源，源码没有做任何混淆处理，方便扩展CSS和js代码彻底分离，修改样式方便简单实用，扩展方便，轻量级框架，快速开发仍然保留了html的页面布局方式支持HTML扩展方式调用UI组件，开发人员不需写js只要懂html语法不需精通js，就可以使用ajax开发后台基于jQuery，UI组件以jQuery插件的形式发布，扩展方便版权声明DWZ框架的源代码完全开放，在ApacheLicense2.0许可下,可免费应用于个人或商业目的。欢迎各大网站转载下载版本。禁止把DWZ框架包装成类外一个UI框架出售。DWZ团队介绍DWZ研发组开发人员目前是3人（兼职）杜权从事UI设计工作，有10年以上UI设计经验。做过至少1500个网站的UI设计。吴平主要做Javaweb开发，兼ajax开发。一直从事电子商务、企业建站平台开发工作。张慧华主要做Javaweb开发，兼ajax开发。以前也是电子商务、企业建站平台开发工作。从2009年4月开始从事建筑能效评估IT解决方案。以前我们做的大部份java项目都用了Ajax，项目开发过程中经常自己做一些UI组件和界面效果。我们对RIA非常感兴趣，业余时间就做了DWZ富客户端框架。DWZ框架中的UI组件都是从我们做过的大量web项目中总结出来的，都是一些非常实用的UI组件。联系方式杜权(UI设计)msn:[e-mail]:8560685吴平(Ajax开发)msn:[e-mail]:465046815张慧华(Ajax开发)msn:[e-mail]:350863780官方微博(欢迎加入)群(满员)107983317jQuery.DWZ-UI-2群(满员)69611933jQuery.DWZ-UI-3群(满员)20866231jQuery.DWZ-UI-4群(满员)369203HTML扩展支持HTML扩展方式来调用DWZ组件Ajax链接扩展ahref=”xxx”target=“ajax”[rel=“boxId”]示例:ahref=w_alert.htmltarget=ajaxrel=container提示窗口/a当前navTab中链接ajaxpost扩展ahref=user.do?method=removetarget=ajaxTodo删除/a或ahref=user.do?method=removetarget=ajaxTodotitle=确定要删除吗?删除/aTitle为可选项，如果设置，点击后将调用alertMsg.confirm与用户交互确认或取消，Title值为提示信息.Target值为ajaxTodo时会自动关联如下JS。$(a[target=ajaxTodo],$p).each(function(){$(this).click(function(event){var$this=$(this);vartitle=$this.attr(title);if(title){alertMsg.confirm(title,{okCall:function(){ajaxTodo($this.attr(href));}});}else{ajaxTodo($this.attr(href));}event.preventDefault();});});dialog链接扩展ahref=”xxx”target=“dialog”[rel=“dialogId”]A所指向页面将会在dialog弹出层中打开，rel标识此弹出层的ID，rel为可选项。Html标签扩展方式示例:ahref=w_dialog.htmltarget=dialogrel=page2弹出窗口/a或ahref=demo_page1.htmltarget=dialog[max=true,mask=true,maxable=true,minable=true,resizable=true,drawable=true]rel=dlg_page1title=[自定义标题]width=800height=480打开窗口一/aMax属性表示此dialog打开时默认最大化,mask表示打开层后将背景遮盖.maxable:dialog是否可最大化，minable:dialog是否可最小化，mixable:dialog是否可最大化resizable:dialog是否可变大小drawable:dialog是否可拖动width:dialog打开时的默认宽度height:dialog打开时默认的高度width,height分别打开dialog时的宽度与高度．fresh:重复打开dialog时是否重新载入数据，默认值true,close:关闭dialog时的监听函数，需要有boolean类型的返回值，param:close监听函数的参数列表，以json格式表示，例{msg:’message’}关闭窗口：在弹出窗口页面内放置buttonclass=closevalue=关闭/button即可。JS调用方式示例:$.pdialog.open(url,dlgId,title);或$.pdialog.open(url,dlgId,title,options);options:{width:100px,height:100px,max:true,mask:true,mixable:true,minable:true,resizable:true,drawable:true,fresh:true,close:”function”,param:”{msg:’message’}”},所有参数都是可选项。关闭dialog层：$.pdialog.close(dialog);参数dialog可以是弹出层jQuery对象或者是打开dialog层时的dlgId.或者$.pdialog.closeCurrent();关闭当前活动层。$.pdialog.reload(url,data,dlid)刷新dlid指定的dialog，url：刷新时可重新指定加载数据的url,data：为加载数据时所需的参数。navTab链接扩展ahref=”xxx”target=“nav