为JqGrid添加Dwr支持

Dwr好用,谁用谁知道,JqGrid好用,谁用谁也知道,但是,JqGrid对Dwr没有好的支持,因为JqGrid把异步接收数据包揽进去了,而Dwr也进行了这样一个异步调用的过程,今天研究了一下这个问题,尝试改一下.(这是很久就写了的,但是始终没有很好的实现,一直拖到了现在)期间用了很多方法来实现修改,最终找到一种比较方便,改动较小的方式。

发现要写jqgrid的插件还真不容易。。。。

只好真接在Jqgird.src.js中改了

研究jqgrid,采用了jquery.ajax来进行数据获取,而dwr已经实现了ajax的功能,这样如何把dwr和JqGrid整合在一起呢?

看了dwr的异步参数和$.ajax的异步参数,发现大同小异。

找到了jqgrid取数据的一段:

$.ajax($.extend({
						url:ts.p.url,type:ts.p.mtype,dataType: dt,data: ***,success:***
						error:***
						beforeSend: *** 

		},$.jgrid.ajaxOptions,ts.p.ajaxGridOptions));


我们把这个extends的结果存下来(ajaxarg),并不忙调用ajax函数

var dwrsettings = {
								async:true,preHook:ajaxarg.beforeSend,httpMethod:ajaxarg.type,timeout:"3000",callback:ajaxarg.success,errorHandler:ajaxarg.error
							
};
OK啦,一切都变得简单了。

这ajax和dwr的参数十分相似,我们只需取消ajax调用,换成我们的dwr方式,就搞定了

上最终修改代码

case "json":
				case "jsonp":
				case "xml":
				case "script":
					var ajaxarg = $.extend({
						url:ts.p.url,data: $.isFunction(ts.p.serializeGridData)? ts.p.serializeGridData.call(ts,ts.p.postData) : ts.p.postData,success:function(data,st,xhr) {
							if ($.isFunction(ts.p.beforeProcessing)) {
								if (ts.p.beforeProcessing.call(ts,data,xhr) === false) {
									endReq();
									return;
								}
							}
							if(dt === "xml") { addXmlData(data,ts.grid.bDiv,rcnt,npage>1,adjust); }
							else { addJSONData(data,adjust); }
							$(ts).triggerHandler("jqGridLoadComplete",[data]);
							if(lc) { lc.call(ts,data); }
							$(ts).triggerHandler("jqGridAfterLoadComplete",[data]);
							if (pvis) { ts.grid.populateVisible(); }
							if( ts.p.loadonce || ts.p.treeGrid) {ts.p.datatype = "local";}
							data=null;
							if (npage === 1) { endReq(); }
						},error:function(xhr,err){
							if($.isFunction(ts.p.loadError)) { ts.p.loadError.call(ts,xhr,err); }
							if (npage === 1) { endReq(); }
							xhr=null;
						},beforeSend: function(xhr,settings ){
							var gotoreq = true;
							if($.isFunction(ts.p.loadBeforeSend)) {
								gotoreq = ts.p.loadBeforeSend.call(ts,settings); 
							}
							if(gotoreq === undefined) { gotoreq = true; }
							if(gotoreq === false) {
								return false;
							} else {
								beginReq();
							}
						}
					},ts.p.ajaxGridOptions);
					if(ts.p.dwr)
					{
						var dwrargs = ts.p.dwr.args;
						var dwrsettings = {
								async:true,errorHandler:ajaxarg.error
							};
						dwrargs[dwrargs.length] = dwrsettings;
						ts.p.dwr.method.apply(this,dwrargs);
					}else
					{	
						$.ajax(ajaxarg);
					}

谢谢你看到这里:目前只实现了初步的修改,想到很多其它地方的。但是时间和精力都有限,暂时不管了。

最关键的东西写在最后:新版本的Jqgrid的datatype参数支持形如:

datatype : 	function  (pdata) 
			{
				$.ajax({
					url:'server.PHP?q=2',data:pdata,dataType:"json",complete: function(jsondata,stat){
						if(stat=="success") {
							var thegrid = jQuery("#listdt")[0];
							thegrid.addJSONData(eval("("+jsondata.responseText+")"))
						}
					}
				});
			}

相关文章

JS原生Ajax操作(XMLHttpRequest) GET请求 POST请求 兼容性问题 利用iframe模拟ajax 实现表单提交的返回...
AJAX 每日更新前端基础,如果觉得不错,点个star吧 😃 https://github.com/WindrunnerMax/E...
踩坑Axios提交form表单几种格式 前后端分离的开发前后端, 前端使用的vue,后端的安全模块使用的SpringSe...
很早就听闻ajax的名声,但是却一直不知道怎么用,今天自己捣鼓了一下,竟然会用了,哈哈哈哈。 为了防止...
需要在服务器上进行哈 jquery的ajax方法: // jquery请求 $.ajax({ url: "./server/slider.js...
Ajax函数封装ajax.js // Get / Post // 参数 get post // 是否异步 // 如何处理响应数据 // URL // var...