DWZ框架常见问题及解决
DWZ中如何整合第三方jQuery插件
jQuery插件一般是$(document).ready()中初始化
$(document).ready(function(){
// 文档就绪,初始化jQuery插件
});
//或者或缩写形式
$(function(){
// 文档就绪,初始化jQuery插件
});
因为DWZ RIA是富客户端思路,第一次打开时加载界面到浏览器端,之后和服务器的交互是存数据交互,不占用界面相关的网络流量。
也就是说,只需要在一个完整的页面(通常是起始页,如index.aspx/index.php/index.jsp等),只有这个页面包含完整的html结构(<head><body>),<head>中引入全部css、js 。其它的页面只需要页面碎片,就是<body></body>中的部分。
因为ajax加载基本原理是:ajax加载一段html代码片段放到当前页面的某个容器中(通常是一个div)。当然也可以是xml结构、json结构,只是在插入到当前页面之前也要转化成html代码片段。如果你ajax加载一个完整的页面(就是包括<head><body>标签的),插入的当前document就有问题了,因为一个document不可能有多个<head><body>标签。
理解了富客户端思路你也就明白了为什么DWZ框架中整合第三方jQuery插件不能在<head>中通过$(document).ready()初始化。
DWZ1.5.2之后版本初始化第三方jQuery插件方式:
V1.5.2版本调整DWZ插件注册和初始化机制。方便DWZ和其它第三方jQuery插件整合,不需要修改dwz.ui.js源码,可以按照DWZ插件注册机制引入外部js。建议把第三方jQuery插件注册相关代码放到外部js文件中,方便以后DWZ版本升级。
第三方jQuery插件注册示例:
DWZ.regPlugins.push(function($p){
// $p 是作用域, jQuery选择器从$p这个父容器中选择,如果没写会引起第三方插件被重复初始化问题
$("img.lazy", $p).lazyload({effect : "fadeIn"});
// $("xxxSeletor", $p).xxxPlugin();
});
Error loading XML document:dwz.frag.xml
直接用IE打开index.html弹出一个对话框:Error loading XML document: dwz.frag.xml
原因:dwz.frag.xml是一个核心文件,需要加载才可以正常使用。IE ajax laod本地文件有限制, 是ie安全级别的问题, 不是框架的问题.
解决方法:放到apache或iis下就可以了. 如果不想安装apache或iis用firefox打开就正常了。
IIS不能用Ajax访问*.html后缀的页面
Ajax访问*.html后缀的页面在Apache很好的工作,但在IIS不行,IIS下firebug调试报错ajax 405Method Not Allowed。
Http405原因是IIS不允许ajax post方式访问*.html后缀的页。
IIS在使用Ajax post方式请求页面时,一定要动态网页后缀的或者用改用get方式!这是IIS的问题,不是框架bug。
也可以试试修改IIS配置,添加扩展名(.html)的脚本映射。
多个navTab页面或dialog页面ID冲突,解决方法
如果多个navTab页面或dialog页面有相同的ID,假设这个ID为:xxxId
$("#xxxId",navTab.getCurrentPanel()); //获取当前navTab中的xxxId
$("#xxxId",$.pdialog.getCurrent()); // 获取当前dialog中的xxxId
jQuery1.4.2和jquery.validate.js在IE的兼容问题
jQuery1.4.2和jquery.validate.js在IE有兼容问题,ajax表单提交在IE不能触发formonsubmit事件。
导致form提交后跳转到了一个白页面。
升级jQuery1.4.2注意事项
jQuery1.4.2对json要求非常严格key、value都要用引号抱起来,否则就无法解析。jQuery1.3.2以前版本没有这种限制。
{"statusCode":"200","message":"操作成功"}
$.ajax()发送ajax请求成功后调用success方法,success根据dataType来解析返回的内容httpData()。
分析jQuery1.4.2源码发现dataType=”json”的处理方式完全不一样了。1.3.2之前版本是用window.eval()来解析JSON结构,1.4.2版本添加了paseJSON()方法来解析。
估计是window.eval()存在安全漏洞,1.4.2版本进行了改进,对JSON格式也要求更严格了。
ECMAScript 5发布有段时间了,其中就包括了解析JSON的原生API-JSON.parse。许多浏览器已经支持了。
主流js库如JQuery,Ext,Prototype都优先使用JSON.parse,不支持该方法的浏览器则使用newFunction或eval。
为何优先使用JSON.parse,我想一个就是性能,原生的总是要快一些吧。此外JSON.parse较eval也更安全。
这里也当然不能落后了,优先使用JSON.parse,不行再用newFunction方式。最后失败了会给failure的第二个参数msg赋值为"parsejson error"
parseJSON: function( data ) {
if ( typeof data !== "string"|| !data ) {
return null;
}
data = jQuery.trim( data );
if ( /^[\],:{}\s]*$/.test(data.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, "@")
.replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, "]")
.replace(/(?:^|:|,)(?:\s*\[)+/g, "")) ) {
return window.JSON && window.JSON.parse ?
window.JSON.parse( data ) :
(new Function("return " +data))();
} else {
jQuery.error( "Invalid JSON: " + data );
}
}
weblogic访问xml问题
weblogic访问xml文件,需要在web.xml中加入下面的声明
<mime-mapping>
<extension>xml</extension>
<mime-type>text/xml</mime-type>
</mime-mapping>
这时再次访问时weblgoic就给加上contentType了
如何自定义DWZ分页参数参数
pagerForm默认使用的当前页参数是pageNum, 每页显示条数numPerPage,查询排序字段名orderField, 升序降序orderDirection, 更改其它参数需要设置DWZ.init(pageFrag,options)的options[“pageInfo”]:
<form id="pagerForm" action="xxx" method="post">
<input type="hidden" name="pageNum"value="1" />/><!--【必须】value=1可以写死-->
<input type="hidden" name="numPerPage"value="20" /><!--【可选】每页显示多少条-->
<input type="hidden" name="orderField"value="xxx" /><!--【可选】查询排序字段-->
<input type="hidden" name="orderDirection" value="asc|desc" />/><!--【可选】升序|降序-->
</form>
<script type="text/javascript">
$(function(){
DWZ.init("dwz.frag.xml",{
loginUrl:"login.html", // 跳到登录页面
statusCode:{ok:200, error:300, timeout:301}, //【可选】
pageInfo:{pageNum:"pageNum", numPerPage:"numPerPage",orderField:"orderField",orderDirection:"orderDirection"}, //【可选,这里自定义分页参数】
debug:false, // 调试模式 【true|false】
callback:function(){
initEnv();
$("#themeList").theme({themeBase:"themes"});
}
});
});
</script>
如何关闭loading
dwz的ajax方法每次调用都会出现读取数据的loading,怎么修改可选的?我自己写了一个局部更新的ajax函数,结果loading太烦人怎么关掉好?
dwz.ui.js中注册了ajax全局事件:
var ajaxbg = $("#background,#progressBar");
ajaxbg.hide();
$(document).ajaxStart(function(){
ajaxbg.show();
}).ajaxStop(function(){
ajaxbg.hide();
});
$.ajax() 有个参数global (Boolean) : (默认: true) 是否触发全局 AJAX 事件.设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。
DWZ局部刷新怎样做?
API调用方式:
$("#xxxId").loadUrl(url,data, callback);
html扩展链接方式:
<a href="url" target="ajax"rel="xxxId"></a>
更多建议: