专业网站建设品牌，十四年专业建站经验，服务6000+客户--广州京杭网络

免费热线：400-963-0016      微信咨询  |  联系我们

• 网站首页
• 网站建设
• 短视频
• 网站推广
• 网站模板
• 客户案例
• 资讯动态
• 关于我们

EasyUI 表单验证

当前位置：网站建设 > 技术支持

 

本教程将要显示你如何验证表单。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();
    }