DWZ富客户端框架小窥

最近公司在做一个考试培训类的web系统，后台管理界面原来是使用的Extjs框架，但是其扩展性不是很好，另外使用Extjs框架的员工确实不是很多。对比的一些成型的js UI框架方案：

• JQuery UI：功能强大，扩展性也很好；但太臃肿，界面不紧凑
• Extjs:目前算是做的最好最成熟的后台UI框架，不过也是太臃肿，扩展性也不是很好
• DWZ富客户端框架：界面做的很适合中国人的口味，而且是基于Jquery,扩展性也很好

最后选择了dwz,在使用的时候发现了一个非常大的问题：dwz的处理ajax请求时，全部使用了Post方式，这有违程序crub开发习惯。

一般我们开发程序的时候，用Get请求来代表Read，Post请求处理Update/Create/Delete。

先看一下部分源代码：

 

$.fn.extend({ loadUrl: function(url, data, callback){ var $this = $(this); if ($.fn.xheditor) { $("textarea.editor", $this).xheditor(false); } $.ajax({ type: 'POST', url: url, cache: false, data: data, success: function(html){ var json = DWZ.jsonEval(html); if (json.statusCode == DWZ.statusCode.timeout) { alertMsg.error(DWZ.msg("sessionTimout"), { okCall: function(){ DWZ.loadLogin(); } }); } if (json.statusCode == DWZ.statusCode.error) { if (json.message) alertMsg.error(json.message); } else { $this.html(html).initUI(); if ($.isFunction(callback)) callback(); } }, error: DWZ.ajaxError }); } })  

我们看到在loadUrl扩展中默认ajax方式全部是Post,去作了一下修改

$.fn.extend({ loadUrl: function(url, data, callback){ var $this = $(this); if ($.fn.xheditor) { $("textarea.editor", $this).xheditor(false); } var baseurl = url; var dataurl = ''; if(typeof(data)!="undefined"){ dataurl = data; } $.ajax({ type: 'GET', url: baseurl, cache: false, data: dataurl, success: function(html){ var json = DWZ.jsonEval(html); if (json.statusCode == DWZ.statusCode.timeout) { alertMsg.error(DWZ.msg("sessionTimout"), { okCall: function(){ DWZ.loadLogin(); } }); } if (json.statusCode == DWZ.statusCode.error) { if (json.message) alertMsg.error(json.message); } else { $this.html(html).initUI(); if ($.isFunction(callback)) callback(); } }, error: DWZ.ajaxError }); })  

如果要加Get请求方式，再加一个getUrl：function就可以了。