• 开创生态文明新时代 绘出美丽中国新图景 2018-04-26
  • 贵州桐梓:困难群众打工差点错过“移民搬迁”之后 2018-04-26
  • 国乒男女队出征第54届世乒赛“盼天晴” 2018-04-26
  • “鲶鱼”初显 “自主三强”以合作应“开放”? 2018-04-25
  • 第二批慈善组织互联网募捐信息平台遴选结果公示 2018-04-25
  • 国乒男女队出征第54届世乒赛“盼天晴” 2018-04-24
  • 崔世安会见吴政隆 双方就推进苏澳合作深入交谈 2018-04-24
  • 音乐剧《朝暮有情人》演绎港穗两地三代情 2018-04-24
  • 3月70城房价环比涨幅扩大 2018-04-24
  • 国际油价4月19日涨跌互现 2018-04-23
  • 南平市人民防空办公室成立武夷新区人防办事处 2018-04-23
  • 劳动者合法权利也不可“任性”滥用 2018-04-22
  • SKT招募绝地求生队员 网友迫切看到faker与韦神对枪! 2018-04-22
  • 送别余光中:诗人虽远行,乡愁永流传 2018-04-22
  • 连超模肯豆都“爱不释脚”的穆勒鞋 你不了解一下?|穆勒鞋|肯豆|超模 2018-04-22
  • 【jeasyui教程】jQuery EasyUI 表单 - 表单验证

    栏目: jeasyui 发布于: 2014-11-27 21:37:01

    jQuery EasyUI 表单 - 表单验证

    本教程将向您展示如何验证一个表单。easyui 框架提供一个 validatebox 插件来验证一个表单。在本教程中,我们将创建一个联系表单,并应用 validatebox 插件来验证表单。然后您可以根据自己的需求来调整这个表单。

    创建表单(form)

    让我们创建一个简单的联系表单,带有 name、email、subject 和 message 字段:

    	<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>
    			&lt;textarea name="message" style="height:60px;"&gt;&lt;/textarea&gt;
    		</div>
    		<div>
    			<input type="submit" value="Submit">
    		</div>
    	</form>
    

    我们添加一个样式名为 easyui-validatebox 到 input 标记,所以 input 标记将根据 validType 属性应用验证。

    当表单无效时阻止表单提交

    当用户点击表单的 submit 按钮时,如果表单是无效的,我们应该阻止表单提交。

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

    如果表单是无效的,将显示一个提示信息。

    下载 jQuery EasyUI 实例

    jeasyui-form-form3.zip


    本文转载自:w3cschool
    本站文章除注明转载外,均为本站原创或编译?;队魏涡问降淖?,但请务必注明出处。
    转载请注明:文章转载自 七星彩票平台
    本文标题:【jeasyui教程】jQuery EasyUI 表单 - 表单验证
    IT技术书籍推荐:
    算法导论(原书第3版)
    算法导论(原书第3版)
    Thomas H.Cormen (作者), Charles E.Leiserson (作者), Ronald L.Rivest (作者), Clifford Stein (作者), 殷建平 (译者), 徐云 (译者), 王刚 (译者), 等 (译者)
    《算法导论(原书第3版)》内容简介:在有关算法的书中,有一些叙述非常严谨,但不够全面;另一些涉及了大量的题材,但又缺乏严谨性?!端惴ǖ悸?原书第3版)》将严谨性和全面性融为一体,深入讨论各类算法,并着力使这些算法的设计和分析能为各个层次的读者接受。全书各章自成体系,可以作为独立的学习单元;算法以英语和伪代码的形式描述,具备初步程序设计经验的人就能看懂;说明和解释力求浅显易懂,不失深度和数学严谨性。全书选材经典、内容丰富、结构合理、逻辑清晰,对本科生的数据结构课程和研究生的算法课程都是非常实用的教材,在IT专业人员的职业生涯中,《算法导论(原书第3版)》也是一本案头必备的参考书或工程实践手册。