zoukankan      html  css  js  c++  java
  • EasyUI 表单验证

    <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();
        }

  • 相关阅读:
    js 改变颜色值
    React之使用Context跨组件树传递数据
    App.js实现使用js开发app的应用,此文是中文文档
    转: CSS3 @media 用法总结
    转: 如何用手机访问电脑本地 localhost 网页或者服务器, 以调试web项目
    js 替换字符串中所有匹配的字符
    转:display:flex不兼容Android、Safari低版本的解决方案 【flex布局】
    转:HTML5页面如何在手机端浏览器调用相机、相册功能
    文本相似度度量
    idea中maven中jdk版本的选择(转)
  • 原文地址:https://www.cnblogs.com/huangf714/p/5911786.html
Copyright © 2011-2022 走看看