借助mootools 快速开发一个重用 ajax 提交方式

     
做web 程序的你,是不是经常会遇到url提交, 请求呢.
 
之间会不会遇到 很多需要修改页面表单域和后台po的对应呢.
 
你是不是想使用java 语法的方式.来写ajax 提交. 并且实现js 对象到 java 对象的一站式映射呢
 
例如:
 
js 对象: data 包含(field1,field2,field3....)
 
java 对象 po 也包含 field1,field2,field3.....
 
这两个对象属性不一定完全一致, 但是你希望他们一致的地方能直接通过ajax 请求到servlet时,直接自动转换,
 
不需要人为的去

request.getparameter("field1")

 然后一个一个的去赋值.
 
那么利用mootools 你可以很灵巧的扩展出你自己所需求的js 类库
 
声明: 本文没有什么创新,没有什么深奥的技术, 有的只是一颗追求简单的心. 如果你也想把你代码从10行缩短到5行,
 
那么你可以试试.
 

• 首要工作:

 
1. js 用上了mootools
2. java后台用上了org.apache.commons.beanutils 包
 
那么现在开始吧:
 

• 第一步:

 
定制自己的servlet 提交类库
 

servlet = new class({			data : {},			responsecall : null,			initialize : function(forward) {				if(forward){					this.data.forward = forward;//这个forward用来转发,如果你的单个servlet就                                //一个业务的话,这里留空就行                                 }				this.data.random = math.random();//这里用了随机数,其实加不加都行			},			submit : function(url) {				var _responsecall = this.responsecall;				new request.json({							url : url,							oncomplete : function(responsejson, text) {								if (responsejson.status == "fail") {									alert(responsejson.message);									return;								}								if (_responsecall) {//如果设置了提交成功的回调									_responsecall(responsejson, text);								}							},							failure : function() {								alert("error post servlet : " + url);							}						}).post(this.data);			}		});

 <br>你是不是发现没有 field1=**&amp;field2=*&amp;field3=... 这种提交方式,那是用了mootools 的json提交 , mootools 类库比不上jquery丰富 但是它在定制自己的js扩展框架那块, 确实jquery比不上的.因为他的语法借鉴的就是java 的oo思想

• 第二步:

 
开始利用自己写的servlet ajax类库来封装数据
 

var sv = new servlet("add");//forward转发,如果servlet 没有其他业务则留空		sv.data.elementid1= $('elementid1').value;		sv.data.elementid2= $('elementid2').value;		sv.data.elementid3= $('elementid3').value;                sv.data.***** = ....... // 灵活的对象赋值方式 		sv.responsecall = addinvresponse;		sv.submit(url);						function addinvresponse(json,text){			alert("添加成功");		}

 
是不是特别像java 的对象声明语法啊.  呵呵, 好戏在后面.
 

• 第三步:

 
这里就到java servlet 了. 看看如何封装js提交的数据的.
 
首先:

request.getparameter("forward")

 你是不是设置了转发
如果设置了
 

if (forward.equals("add")) {			addclass(request, response);		}

 那好:  看addclass方法

myclass inv = new myclass();		inv = (myclass) parserequestutils.parserequest(request, inv);//数据封装

 哦哈? 难道这个inv 对象就包含了. js 中设置 field1 ,field2 ,field3的值了么?
是滴, 你懂得
 
 
那么来看看 这个parserequestutils.parserequest又是何方神圣.
 

public static object parserequest(httpservletrequest request, object bean) {		// 取得所有参数列表		enumeration enumobj = request.getparameternames();		// 遍历所有参数列表		while (enumobj.hasmoreelements()) {			object obj = enumobj.nextelement();			try {				// 取得这个参数在bean中的数据类开				class cls = propertyutils.getpropertytype(bean, obj.tostring());				if(cls==null){					continue;				}				// 把相应的数据转换成对应的数据类型				object beanvalue = convertutils.convert(request						.getparameter(obj.tostring()), cls);				// 添冲bean值				propertyutils.setproperty(bean, obj.tostring(), beanvalue);			} catch (illegalaccessexception e) {				// todo auto-generated catch block				e.printstacktrace();			} catch (invocationtargetexception e) {				// todo auto-generated catch block				e.printstacktrace();			} catch (nosuchmethodexception e) {				// todo auto-generated catch block				e.printstacktrace();			}		}		return bean;	}

 
哦, 到这里算是看明白了. 不就是把提交的request请求的参数一个个对应类型放入java 对象了中了么.
 
是滴.是这样的. 如果你们有更简单的方法,望赐教!
 

• 第四步:

还等啥? 操作吧
 

service.insertmyclass(inv);

 
备注: 
 
[size=xx-small;]回头你们可以试试 在js 中随意的增删几个参数, java对象就会改变, 是不是少写很多代码啊.[/size]
[size=xx-small;]<br>[/size]
[size=xx-small;]这个servlet js类库 , 只能操作一般的基于页面表单方式的提交或者请求 , 暂时没有做文件上传, 不过大家扩展的话,应该不是难题. [/size]