easyui 里面如何高效的用Ajax 提交表单

   1.使普通表单成为ajax提交方式的表单。

    

<form id="ff" method="post">
		<div>
			<label for="name">Name:</label> 
			<input class="easyui-validatebox" 
			validType="remote['TestServlet','pname']  //remote['路径URL','参数名'],直接在Servlet获取,
			 //每输入一次,就发送一次AJAX请求
				type="text" name="name" data-options="required:true" />  //必添项
		</div>
		<div>
			<label for="email">Email:</label> 
			<input class="easyui-validatebox"
				type="text" name="email" data-options="validType:'email'" />  //添加类型
		</div>
	</form>
	<a id="btn" href="javascript:void(0)">提交</a> 
	$("#ff").form({		
		url:"TestServlet",
		onSubmit:function() {   //在提交之前触发,返回false可以终止提交。
			var r = $("#ff").form("validate");  //做表单字段验证,当所有字段都有效的时候返回true。
			console.log(r);     
			return r;
		},
		success:function(data) {
			var o = eval("("+data+")");		 //解析字符串,此方法不怎么使用	
			alert(o.result);    
		}		
	}); 

2.用户名验证

<form id="ff" method="post">
		<div>
			<label for="name">Name:</label> 
			<input class="easyui-validatebox" 
			validType="remote['TestServlet','pname']  //remote['路径URL','参数名'],直接在Servlet获取,
			 //每输入一次,就发送一次AJAX请求
				type="text" name="name" data-options="required:true" />  //必添项
		</div>
		<div>
			<label for="email">Email:</label> 
			<input class="easyui-validatebox"
				type="text" name="email" data-options="validType:'email'" />  //添加类型
		</div>
	</form>
	<a id="btn" href="javascript:void(0)">提交</a> 
$("#btn").click(function() {   //提交按钮 ,利用ajax来获取表格里面的数据	   		
		
		var r = $("#ff").form("validate");    //做表单字段验证,当所有字段都有效的时候返回true。
		
		if(r) {
			var o = $("#ff").serializeArray(); //序列表格内容为字符串,用于Ajax请求,   
			// console.log(o);  在控制台打印出来的话,显示的是Object,显示的是name,value值,空的<input>   
			$.ajax({
				url:"TestServlet",
				type:"post",
				data:o,  //在Servlet里面直接获取的便就是这个o
				dataType:"json",
				success:function(data) {
					alert(data.result);
				},
				error:function() {
					
				}
			});
		} else {
			alert("error");
		}
		
		
	}); 

TestServlet

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setCharacterEncoding("utf-8");
				String name = request.getParameter("name");
		String email = request.getParameter("email");
		String pname = request.getParameter("pname");
		
		/*System.out.println(name);
		System.out.println(email);
		System.out.println(pname);   看一下获取的是什么 */   
		//response.getWriter().append("{"result":"already receive"}");  弹出一个对话框
		 String result = "";
		if(pname.equals("zibohanqi")) {   //获取pname,进行验证
			result = "true";
		} else {
			result = "false";
		}


}
原文地址:https://www.cnblogs.com/zuo72/p/8250743.html