成人网址在线观看,97艹逼,欧美小电影

jQuery EasyUI使用教程：表單驗證

原創(chuàng)|使用教程|編輯：龔雪|2016-08-31 09:11:37.000|閱讀 697 次

概述：本教程將向您展示如何驗證一個表單，easyui框架提供一個validatebox插件來驗證一個表單。在本教程中，我們將創(chuàng)建一個聯(lián)系表單，并應用validatebox插件來驗證表單,然后您可以根據(jù)自己的需求來調整這個表單。

# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

本教程將向您展示如何驗證一個表單。easyui框架提供一個validatebox插件來驗證一個表單。在本教程中，我們將創(chuàng)建一個聯(lián)系表單，并應用validatebox插件來驗證表單,然后您可以根據(jù)自己的需求來調整這個表單。

jQuery EasyUI最新試用版下載請猛戳>>

創(chuàng)建表單

讓我們創(chuàng)建一個簡單帶有name、email、subject和message字段的聯(lián)系表單：

<div style="padding:3px 2px;border-bottom:1px solid #ccc">Form Validation</div>
<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>

我們添加一個樣式名為easyui-validatebox到input標記中，所以input標記將根據(jù)validType屬性應用驗證。

當表單無效時阻止表單提交

當用戶點擊表單的submit按鈕時，如果表單是無效的，我們應該阻止表單提交。

$('#ff').form({
url:'form3_proc.php',
onSubmit:function(){
return $(this).form('validate');
},
success:function(data){
$.messager.alert('Info', data, 'info');
}
});

如果表單是無效的，將顯示一個提示信息。

下載EasyUI示例：