为JqGrid添加Dwr支持

前端之家收集整理的这篇文章主要介绍了为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.@H_404_14@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+")"))
						}
					}
				});
			}

猜你在找的Ajax相关文章