发布：2013/5/5 15:23:12作者：管理员 来源：本站 浏览次数：1704
本教程将要显示你如何验证表单。easyui框架提供了validatebox插件以验证表单。在这个教程中，我们将要构建联系表单并且应用validatebox插件验证表单。你可以修改它适应自己的要求。
构建表单
让我们构建简单的内容的表单： name, email, subject 和message 字段:
<div style="background:#fafafa;padding:10px;width: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();
}
© Copyright 2014 - 2024 柏港建站平台 ejk5.com. 渝ICP备16000791号-4