dwr学习(二):提交简单的表单数据

注:这个实例只提交简单的数据,如基本数据类型。

1、基本页面结构:

<body>
	提交表单数据:
	<form name="dwrForm"> 
		<p>用户名:<input type="text" name="userName"/></p> 
		<p>密码:<input type="password" name="passWord"/></p> 
		<p>年龄: <input type="text" name="age"/></p>
		<p>生日: <input type="text" name="birthday"/></p> 
		<input type="button" value="提交" onclick="submitFormData();" />
	</form> 
 </body>

2、dwr配置:

<convert converter="bean" match="com.wjl.test.SUser" ></convert>
<create creator="new" javascript="Service">
	<param name="class" value="com.wjl.test.Services" />
	<include method="getUser"/>
</create>

3、调用js与后台进行交互:

function submitFormData(){
	//1、获取表单数据
	var formMap = dwr.util.getValues("dwrForm"); 
	//alert(formMap);
       alert("客户端读取到的表单项:\n用户名:"+formMap["userName"]+"\n密码:"+formMap["passWord"]+"\n年龄:"+formMap["age"]+"\n生日:"+formMap["birthday"]);
       
       //2、传递到后台
       Service.getUser(formMap,function(result){
       	alert("从服务端返回的数据:\n用户名:"+result.userName+"\n密码:"+result.passWord+"\n年龄:"+result.age+"\n生日:"+result.birthday); 
       });
}

4、后台数据处理:

user实体类:

public class SUser {
	private String userName; 
	private String passWord;
	private int age;
	private String birthday;
	
	//getter、setter方法
}

services类:

import java.util.Map;
import com.sun.org.apache.commons.beanutils.BeanUtils;
public class Services {
	public SUser getUser(Map formMap){
		 SUser user = new SUser(); 
		  try{ 
		   BeanUtils.populate(user, formMap); 
		  }catch(Exception e){ 
		   e.printStackTrace(); 
		  } 
		  System.out.println("==============客户端传来的信息=============="); 
		  System.out.println("FormBean.username:"+user.getUserName()); 
		  System.out.println("FormBean.password:"+user.getPassWord()); 
		  System.out.println("FormBean.age:"+user.getAge()); 
		  System.out.println("FormBean.birthday:"+user.getBirthday()); 
		  System.out.println("========================================="); 
		  return user; 
	}
}

PS:为什么只是简单的 数据类型,因为复杂的数据会报错。

如最开始的设想,将birthday属性设置为Date类型,提交数据也严格遵守时间格式,结果报错:

java.lang.IllegalArgumentException: argument type mismatch

相关推荐