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

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

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

jquery-easyui中的表单验证

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

Query EasyUI中进行表单验证主要是通过validatebox插件，看一个例子： Html代码  

1. <div style="background:#fafafa;padding:10px;width:300px;height:300px;">  
2.     <form id="ff" method="post">  
3.         <div>  
4.             <label for="name">Name:</label>  
5.             <input class="easyui-validatebox" type="text" name="name" required="true"></input>  
6.         </div>  
7.         <div>  
8.             <label for="email">Email:</label>  
9.             <input class="easyui-validatebox" type="text" name="email" required="true" validType="email"></input>  
10.         </div>  
11.         <div>  
12.             <label for="subject">Subject:</label>  
13.             <input class="easyui-validatebox" type="text" name="subject" required="true"></input>  
14.         </div>  
15.         <div>  
16.             <label for="message">Message:</label>  
17.             <textarea name="message" style="height:60px;"></textarea>  
18.         </div>  
19.         <div>  
20.             <input type="submit" value="Submit">  
21.         </div>  
22.     </form>  
23. </div>  

这个表单对name,email,subject字段定义为必填字段，并且对email字段中的填写格式作了限制。

为了防止表单验证未通过时进行提交，必须：

Js代码  

1. $('#ff').form({  
2.     url:'/demo7/ProcessServlet',  
3.     onSubmit:function(){  
4.         return $(this).form('validate');  
5.     },  
6.     success:function(data){  
7.         alert(data);  
8.     }  
9. });  

运行一下，看看效果：