easyui表单多Bean加载与提交

最新推荐文章于 2018-10-22 23:01:32 发布

柈海

最新推荐文章于 2018-10-22 23:01:32 发布

阅读量750

点赞数

分类专栏： java 文章标签： html java bean 表单 easyui

本文链接：https://blog.csdn.net/lylhjh/article/details/73730773

版权

java 专栏收录该内容

14 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<link rel="stylesheet" type="text/css" href="../../css/easyui/themes/default/easyui.css" >
	<link rel="stylesheet" type="text/css" href="../../css/easyui/themes/icon.css" >
	<script type="text/javascript" src="../../js/lib/jquery.min.js"></script>
	<script type="text/javascript" src="../../js/lib/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../../js/util/easyuiUtil.js"></script>
</head>
<body>
<form id="fm" method="post" enctype="multipart/form-data"  style="text-align:left">
 	<input class="easyui-textbox" name="users[0].username">
	<input class="easyui-datebox" name="users[0].makedatetime">
 	<input class="easyui-textbox" name="users[1].username"> 
 	<input class="easyui-datebox" name="users[1].makedatetime">
	<input   name="users[0].file" class="easyui-filebox" data-options="buttonText:'上传文件',prompt:'支持上传小于10M的rar或pdf文件'"/>
	<input  name="users[1].file" class="easyui-filebox" data-options="buttonText:'上传文件',prompt:'支持上传小于10M的rar或pdf文件'"/>
 	<input class="easyui-textbox"  name="users[1].account.credit">
 	<input  name="users[1].auth" class="easyui-combobox" data-options="valueField: 'VALUE',textField: 'LABEL',data:statu_arr4" />
 	<a href="#" οnclick="submit()">提交</a>
 	<a href="#" οnclick="inform()">加载数据</a>
</form>
<script type="text/javascript">
var statu_arr4 = [{'LABEL': '是','VALUE': '1'},{'LABEL': '否','VALUE': '0'}];

function submit(){
	$('#fm').form('submit',{
		queryParams:{},
		onSubmit: function(){},
		url:'../../hellow/getForm.do',
		success: function(result){}
	})
}
function inform(){
	$.get('../../hellow/inform.do',{},function(data){
		var params = {};
		var temp;
		params['users'] = eval('(' + data + ')');
		$('#fm').find('input').each(function(){
				var obj = $(this);
		   		var name =obj.attr('textboxname');
		   		if(name){
		   			try{
		    		console.log(name+'==='+eval('params.'+name));
		    		temp = eval('params.'+name);
		    		}catch(e){
						return false;
					}
		    		if(obj.attr('class').indexOf('easyui-datebox')!=-1){temp = formate_date_2(temp);}
					if(obj.attr('class').indexOf('easyui-combobox')!=-1){obj.combobox('setValue',temp);return false;}
		    		obj.textbox('setValue',temp);	    	 	
		   		}
			
	   	
	   	});
	})
}
function formate_date_2(value){
 	var date = new Date(value);
 	var y = date.getFullYear();
 	var m = date.getMonth()+1;
 	var d = date.getDate();
 	return y+'/'+m+'/'+d;	
 }
</script>
</body>
</html>





public class UserModel implements Serializable{
	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;
	private List<User> users;
	
	public List<User> getUsers() {
		return users;
	}

	public void setUsers(List<User> users) {
		this.users = users;
	}
	
	UserModel(){
		
	}
}


	@RequestMapping("/getForm.do")
	public void getForm(UserModel users){
		for(User u :users.getUsers()){
			System.out.println(u.getUsername()+" "+u.getMakedatetime());
			System.out.println(u.getFile().getOriginalFilename());
		}
	}
	@RequestMapping("/inform.do")
	@ResponseBody
	public List<User> inForm(){
		List<User> list = new ArrayList<User>();
		User u = new User();
		u.setUsername("刘先生");
		u.setMakedatetime(new Date());
		User u2 = new User();
		u2.setUsername("liu");
		u2.setAuth("1");
		Account a = new Account();
		a.setCredit("123");
		u2.setMakedatetime(new Date());
		u2.setAccount(a);
		list.add(u);
		list.add(u2);
		return list;
	}