DWZ框架常见问题及解决

2018-11-17 15:41 更新

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>

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号