框架jquery

DWZ富客户端框架Page1DWZ富客户端框架使用手册概述5设计思路5学习DWZ的建议5DWZ区别于其它JS框架,最大的优点6版权声明6DWZ团队介绍6HTML扩展7Ajax链接扩展7当前navTab中链接ajaxpost扩展7dialog链接扩展7navTab链接扩展8Tab组件扩展9Accordion组件9容器高度自适应10CSSTable10Table扩展11在线编辑器11分页组件11ajaxTodo扩展12dwzExport列表数据导出12Inputalt扩展13Tree扩展13Panel扩展13日历控件14url变量替换16checkbox全选、反选17uploadify多文件上传17combox组件19suggest+lookup+主从结构20查找带回20主从结构21Ajax表单21表单查询21DWZ富客户端框架Page2普通Ajax表单提交23服务器端响应24文件上传表单提交25服务器端响应25Java服务器端表单处理示例26DWZjs库介绍28DWZ框架初始化28dwz.
core.
js28dwz.
ui.
js28dwz.
ajax.
js28dwz.
alertMsg.
js28dwz.
jDialog.
js28dwz.
accordion.
js28dwz.
barDrag.
js29dwz.
navTab.
js29dwz.
scrollCenter.
js29dwz.
stable.
js29dwz.
cssTable.
js29dwz.
tree.
js29dwz.
theme.
js29dwz.
validate.
method.
js29dwz.
validate.
zh.
js29dwz.
contextmenu.
js29dwz.
pagination.
js30dwz.
database.
js30dwz.
datepicker.
js30dwz.
combox.
js30dwz.
checkbox.
js30dwz.
uitl.
date.
js30dwz.
regional.
zh.
js30dwz.
validate.
method.
js31Javascript混淆和压缩31Javascript混淆31Javascript用gzip压缩32DWZ如何中使用打包的js32常见问题及解决34DWZ富客户端框架Page3DWZ中如何整合第三方jQuery插件34ErrorloadingXMLdocument:dwz.
frag.
xml34IIS不能用Ajax访问*.
html后缀的页面34多个navTab页面或dialog页面ID冲突,解决方法35jQuery1.
4.
2和jquery.
validate.
js在IE的兼容问题35升级jQuery1.
4.
2注意事项35weblogic访问xml问题36如何自定义DWZ分页参数参数36如何关闭loading36DWZ局部刷新怎样做36DWZ版本升级37V1.
5.
337V1.
5.
237V1.
5.
137V1.
4.
737V1.
4.
638V1.
4.
538V1.
4.
438V1.
4.
338V1.
4.
238V1.
4.
138V1.
3Final38V1.
3RC439V1.
3RC339V1.
3RC239V1.
3RC140V1.
2Final41V1.
2RC141V1.
1.
6Final42V1.
1.
6RC342V1.
1.
6RC242V1.
1.
6RC142V1.
1.
5Final42V1.
1.
5RC343V1.
1.
5RC243V1.
1.
5RC143DWZ富客户端框架Page4V1.
1.
5Beta143V1.
1.
4Final43V1.
1.
343V1.
1.
243V1.
1.
144v1.
1.
044v1.
0.
644v1.
0.
544附录46附录一Firebug介绍46补充说明和常见问题(xiaosuiba)47DWZ富客户端框架Page5概述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开发水平.
在线演示地址http://j-ui.
com/在线文档http://j-ui.
com/doc/dwz-user-guide.
pdfCode下载:https://code.
csdn.
net/dwzteam/设计思路第一次打开页面时载入界面到客户端,之后和服务器的交互只是数据交互,不占用界面相关的网络流量.
支持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富客户端框架Page6DWZ区别于其它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开发转型做HTML5手机APP.
以前我们做的大部份java项目都用了Ajax,项目开发过程中经常自己做一些UI组件和界面效果.
我们对RIA非常感兴趣,业余时间就做了DWZ富客户端框架.
DWZ框架中的UI组件都是从我们做过的大量web项目中总结出来的,都是一些非常实用的UI组件.
联系方式杜权(UI设计)d@j-ui.
com吴平(Ajax开发)w@j-ui.
com张慧华(Ajax开发)z@j-ui.
com官方微博(欢迎加入)http://weibo.
com/dwzuijQuery.
DWZ-jUI-1群(满员)107983317jQuery.
DWZ-jUI-2群(满员)69611933jQuery.
DWZ-jUI-3群(满员)20866231jQuery.
DWZ-jUI-4群(满员)369203jQuery.
DWZ-jUI-5群(满员)85031937jQuery.
DWZ-jUI-6群(欢迎加入)172602882jQuery.
DWZ-jUI-7群(满员)210322217jQuery.
DWZ-jUI-8群(欢迎加入)139067378合作电话:010-5289707318600055221技术服务:0571-8851762517767167745DWZ富客户端框架Page7HTML扩展支持HTML扩展方式来调用DWZ组件Ajax链接扩展示例:提示窗口当前navTab中链接ajaxpost扩展删除或删除Title为可选项,如果设置,点击后将调用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链接扩展A所指向页面将会在dialog弹出层中打开,rel标识此弹出层的ID,rel为可选项.
Html标签扩展方式示例:弹出窗口或打开窗口一DWZ富客户端框架Page8Max属性表示此dialog打开时默认最大化,mask表示打开层后将背景遮盖.
maxable:dialog是否可最大化,minable:dialog是否可最小化,maxable:dialog是否可最大化resizable:dialog是否可变大小drawable:dialog是否可拖动width:dialog打开时的默认宽度height:dialog打开时默认的高度width,height分别打开dialog时的宽度与高度.
fresh:重复打开dialog时是否重新载入数据,默认值true,close:关闭dialog时的监听函数,需要有boolean类型的返回值,param:close监听函数的参数列表,以json格式表示,例{msg:'message'}关闭窗口:在弹出窗口页面内放置即可.
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:{},dialogId:"",callback:null})刷新dialogId指定的dialog,url:刷新时可重新指定加载数据的url,data:为加载数据时所需的参数.
navTab链接扩展示例:默认页面自定义页面iframe方式打开DWZ富客户端框架Page9target=navTab:自动关联调用navTab组件rel:为navtab的ID值,后续可以用来重载该页面时使用,如当前页新增或删除数据可以通过该ID进行通知JS重载.
注意rel的值区分大小写.
fresh:表示重复打开navTab时是否重新加载数据external:为external="true"或者href是外网连接时,以iframe方式打开navTab页面Js调用navTab.
openTab(tabid,url,{title:"NewTab",fresh:false,data:{}});其中data:{}json格式的数据Tab组件扩展开发人员不需写任何javacsript,只要使用下面的html结构就可以.
标题1标题2