Jquery插件easyUi表单验证提交

最新推荐文章于 2020-07-15 10:19:20 发布

Matrix-

最新推荐文章于 2020-07-15 10:19:20 发布

阅读量1.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery easyUi

本文链接：https://blog.youkuaiyun.com/luojian520025/article/details/23857197

jquery easyUi 专栏收录该内容

1 篇文章

订阅专栏

这是一个关于如何利用Jquery插件easyUi进行表单验证和提交的示例。示例中展示了如何设置必填项、长度限制以及自定义错误提示。表单包含多个输入字段，如命令、描述、类型、分数和使用状况。提交表单时，会首先进行验证，只有验证通过才会发送请求到'/ProcessServlet'，并显示服务器返回的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[html]view plaincopyprint? 
   
 <form id="myForm" method="post">  
         <table align="center" style="width:400px;height:auto;margin-top: 20px">    
             <tr>                                
                 <td align="right">命令：</td>      
                 <td><input id="cmd" name="cmd" style="width: 200px;" class="easyui-validatebox" required="true" validType="length[5,12]" missingMessage="不能为空"/></td>   
             </tr>  
             <tr>                
                 <td align="right">描述：</td>  
                  <td><input id="depict" name="depict" style="width: 200px;" class="easyui-validatebox" required="true" validType="length[5,12]" missingMessage="不能为空"/></td>   
             </tr>  
             <tr>                 
                 <td align="right">类型：</td>                 
                 <td><input id="type" style="width: 200px" class="easyui-validatebox"  
                     url="data/editHealthCheckCombobox_data.json" valueField="id"  
                     textField="text" /></td>   
             </tr>   
             <tr>  
                 <td align="right">分数：</td>                 
                 <td><input id="score" name="score" style="width: 200px" valueField="number"/></td>   
             </tr>  
             <tr>   
                 <td align="right">使用状况：</td>                 
                 <td><input id="isUse" style="width: 200px" class="easyui-validatebox"/></td>   
             </tr>   
             <tr>   
                 <td align="center" colspan="2">  
                     <input type="submit"  value="提交"/>  
                     <input type="reset" value="重置"/>  
                 </td>                 
             </tr>  
         </table>  
     </form>  

[javascript]view plaincopyprint? 
   
 //表单提交  
     $('#myForm').form({  
         url:'/ProcessServlet',  
         onSubmit:function(){  
             return $(this).form('validate');  
         },  
         success:function(data){  
             alert(data);  
         }  
     });   