easy ui 验证框的使用

Easy ui 插件之validatebox 

missingMessage:未填写时显示的信息
validType:验证类型见下示例
invalidMessage:无效的数据类型时显示的信息
required="true" 必填项
class="easyui-validatebox" 文本验证
class="easyui-numberbox" 数字验证

required="true" 必填字段
invalidMessage="请填写正确的格式"

属性

 1 <form id="itemsForm"  enctype="multipart/form-data" style="padding:10px 20px 10px 40px;">
 2             <p>名称: <input name="name" type="text" class="easyui-validatebox" required="true" missingMessage="商品名称必须填写"></p>
 3             <p>规格: <input name="detail" type="text" class="easyui-validatebox" required="true" ></p>
 4             <p>价格: <input name="price" type="text"  class="easyui-numberbox"  required="true"></p>
 5             <p>日期: <input name="createtime" type="text" class="Wdate" onClick="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss' })"></p>
 6              <p>照片:<input class="easyui-filebox" data-options='onChange:change_photo' id="file_upload" name="items_pic"/><br/>
 7              <div id="Imgdiv">
 8                 <img id="Img" width="200px" height="200px"/>
 9             </div>             
10             <div style="padding:5px;text-align:center;">
11                 <a href="#" class="easyui-linkbutton" icon="icon-ok" onclick="addItems()">确认</a>
12                 <a href="#" class="easyui-linkbutton" icon="icon-cancel">返回</a>
13             </div>
14         </form>
 
名称类型描述
  • 默认值
required boolean 定义是否字段应被输入。 false
validType string,array 定义字段的验证类型,比如 email、url,等等。可能的值:
1、验证类型字符串,应用单个验证规则。
2、验证类型数组,应用多个验证规则。单个字段上的多个验证规则自版本 1.3.2 起可用。

代码实例:
  1. <input class="easyui-validatebox" data-options="required:true,validType:'url'">
  2. <input class="easyui-validatebox" data-options="
  3. required:true,
  4. validType:['email','length[0,20]']
  5. ">
null
delay number 延迟验证最后的输入值。该属性自版本 1.3.2 起可用。 200
missingMessage string 当文本框为空时出现的提示文本。 该字段是必需的。
invalidMessage string 当文本框的内容无效时出现的提示文本。 null
tipPosition string 定义当文本框的内容无效时提示消息的位置。可能的值:'left'、'right'。该属性自版本 1.3.2 起可用。 right
deltaX number 在 X 方向的提示偏移。该属性自版本 1.3.3 起可用。 0
novalidate boolean 当设置为 true 时,则禁用验证。该属性自版本 1.3.4 起可用。 false
原文地址:https://www.cnblogs.com/lrzy/p/8715323.html