<div style="background:#fafafa;padding:10px;300px;height:300px;"> <form id="ff" method="post"> <div> <label for="name">Name:</label> <input class="easyui-validatebox" type="text" name="name" required="true"></input> </div> <div> <label for="email">Email:</label> <input class="easyui-validatebox" type="text" name="email" required="true" validType="email"></input> </div> <div> <label for="subject">Subject:</label> <input class="easyui-validatebox" type="text" name="subject" required="true"></input> </div> <div> <label for="message">Message:</label> <textarea name="message" style="height:60px;"></textarea> </div> <div> <input type="submit" value="Submit"> </div> </form> </div>
我们添加class名为easyui-validatebox到input标记，所以input标记应用验证依照validType属性。
当出现错误的时候阻止表单发送
当用户点击发送按钮，我们应该阻止有错误的表单发送。
$('#ff').form({
url:'/demo7/ProcessServlet',
onSubmit:function(){
return $(this).form('validate');
},
success:function(data){
alert(data);
}
});
如果表单不可以，出现提示：
编写处理代码
最后，我们编写后台处理服务代码，这个代码显示在控制台上的接收参数并发送简单信息到前台页面。
public class ProcessServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String name = request.getParameter("name");
String email = request.getParameter("email");
String subject = request.getParameter("subject");
String message = request.getParameter("message");
System.out.println("Name:"+name);
System.out.println("Email:"+email);
System.out.println("Subject:"+subject);
System.out.println("Message:"+message);
PrintWriter out = response.getWriter();
out.println("ok");
out.close();
}