表单验证
<form class="pui-form ffm fm" action="" id="submitForm" action="">
<div class="row mgt10 required">
<!-- required 红点样式 -->
<div class="col-xs-3 col-key tr"><span class="pdr10">姓名:</span></div>
<div class="col-xs-9 col-val">
<input type="text" class="txt wp100" data-req="true" data-empty-msg="小哥请留下您的大名" />
<!-- data-req="true" // 为必填项 -->
<!-- data-empty-msg="***" // 自定义必填框为空的错误提示语句 -->
<!-- data-reqs="six, spcode, integer, ... " // 校验规则,可随意组合,请用逗号,隔开 -->
<input type="text" class="txt wp100" data-reqs="six" />
<!-- data-reqs="six" // 最小6位 -->
<input type="text" class="txt wp100" data-reqs="spcode" />
<!-- data-reqs="spcode" // 特殊符号: &#、<加字母、<!、</ -->
<input type="text" class="txt wp100" data-reqs="maxlength" />
<!-- data-reqs="maxlength" // 最小长度 -->
<input type="text" class="txt wp100" data-reqs="minlength" />
<!-- data-reqs="minlength" // 最大长度 -->
<input type="text" class="txt wp100" data-reqs="integer" />
<!-- data-reqs="integer" // 整数 -->
<input type="text" class="txt wp100" data-reqs="integerp" />
<!-- data-reqs="integerp" // 非零正整数 -->
<input type="text" class="txt wp100" data-reqs="integern" />
<!-- data-reqs="integern" // 非零负整数 -->
<input type="text" class="txt wp100" data-reqs="integerp0" />
<!-- data-reqs="integerp0" // 含零正整数 -->
<input type="text" class="txt wp100" data-reqs="integern0" />
<!-- data-reqs="integern0" // 含零负整数 -->
<input type="text" class="txt wp100" data-reqs="numberange" data-number-range="-10,10" />
<!-- data-reqs="numberange" // 整数范围(含零) -->
<input type="text" class="txt wp100" data-reqs="mail" />
<!-- data-reqs="mail" // 邮件 -->
<input type="text" class="txt wp100" data-req="true" data-reqs="customize" data-customize-rule="/^abc/" data-customize-tip="必须以abc开头的字符串" />
<!-- data-customize-rule="" // 正则表达式 -->
<!-- data-customize-tip="" // 自定义错误信息 -->
<input type="text" class="txt wp100" data-reqs="mobile" />
<!-- data-reqs="mobile" // 手机 // 最新支持 13,14,15,16,17,18,19 开头号码 -->
<input type="text" class="txt wp100" data-reqs="idcard" />
<!-- data-reqs="idcard" // 身份证 // 支持 15,18位 -->
<input type="text" class="txt wp100" data-reqs="website" />
<!-- data-reqs="website" // 网址 -->
<input type="text" class="txt wp100" data-reqs="chinese" />
<!-- data-reqs="chinese" // 中文 -->
<input type="text" class="txt wp100" data-reqs="upload" data-format="jpg,png,gif" />
<!-- data-reqs="upload" // 上传 -->
<!-- data-format // 验证格式 -->
<input type="text" class="txt wp100" data-reqs="psw1" />
<!-- data-reqs="psw1" // 旧密码 -->
<input type="text" class="txt wp100" data-reqs="psw2" />
<!-- data-reqs="psw2" // 新密码 -->
<input type="text" class="txt wp100" data-reqs="psw2b" />
<!-- data-reqs="psw2b" // 确认新密码 -->
<input type="text" class="txt wp100" data-reqs="query" data-query="url" query-string="" />
<!-- data-reqs="query" // 同步查询 -->
<!-- data-query // 必填,请求路径 -->
<!-- query-string // 必填,请求参数,json字符串格式,如 {"id":"0","copyId":"0"},空对象请输入 {} -->
<!-- 后台接口请参考 -->
<!-- { Status: true } -->
<!-- 或 -->
<!-- { Status: false, Message: "输入有误" } -->
<textarea data-reqs="maxrows" data-max-rows="5"></textarea>
<!-- data-reqs="maxrows" // 最大行数,只适用于textarea -->
</div>
</div>
<div class="row mgt10 required">
<div class="col-xs-3 col-key tr"><span class="pdr10">附件:</span></div>
<div class="col-xs-9 col-val">
<div class="upload-group por100" id="formUpload">
<div class="pdr10">
<input name="filetxt" class="txt wp100 fs filetxt" type="text" data-req="true" data-reqs="upload" data-format="jpg,png,gif" readonly />
</div>
<div class="abs">
<input name="filelogo" class="upfile wp100" type="file" id="upLogo" />
<button class="btn bgc-green c-white wp100 fs" type="button">请选择</button>
</div>
</div>
<!--
data-reqs="upload" // 上传
data-format="jpg,png,gif" 验证格式
-->
</div>
</div>
<div class="row mgt10 required">
<div class="col-xs-3 col-key tr"><span class="pdr10">城市:</span></div>
<div class="col-xs-9 col-val">
<div class="radio-group clearfix" id="formRadio" data-req="true" data-reqs="radio">
<div class="radione inline">
<input type="radio" name="radiobj" value="a" /><span>帝都</span>
</div>
<div class="radione inline">
<input type="radio" name="radiobj" value="b" /><span>魔都</span>
</div>
<div class="radione inline">
<input type="radio" name="radiobj" value="c" /><span>成都</span>
</div>
</div>
<!--
data-reqs="radio" // radio
-->
</div>
</div>
<div class="row mgt10 required">
<div class="col-xs-3 col-key tr"><span class="pdr10">最爱电影:</span></div>
<div class="col-xs-9 col-val">
<div class="check-group clearfix" id="formCheckbox" data-req="true" data-reqs="checkbox">
<div class="checkone inline">
<input type="checkbox" name="chkboxbj" value="x" /><span>惊天魔盗团</span>
</div>
<div class="checkone inline">
<input type="checkbox" name="chkboxbj" value="y" /><span>论文叙老点柳先开</span>
</div>
<div class="checkone inline">
<input type="checkbox" name="chkboxbj" value="z" /><span>青春梦工厂</span>
</div>
</div>
<!--
data-reqs="checkbox" // checkbox
-->
</div>
</div>
<div class="row mgt10 required">
<div class="col-xs-3 col-key tr"><span class="pdr10">电视剧:</span></div>
<div class="col-xs-9 col-val">
<select id="formSelect" name="tv" data-width="200px" class="select select-group" data-req="true">
<option value="" selected>请选择</option>
<option value="1">平凡的世界</option>
<option value="2">琅邪榜</option>
<option value="3">三国演义</option>
<option value="4">手撕鬼子</option>
</select>
<!--
data-reqs="select" // select
-->
</div>
</div>
<div class="row mgt10 required">
<div class="col-xs-3 col-key tr"><span class="pdr10">简介:</span></div>
<div class="col-xs-9 col-val">
<textarea name="textarea" class="textarea wp100" cols="30" rows="5" data-req="true" data-reqs="max" data-max=200></textarea>
</div>
</div>
<div class="row mgt10">
<div class="col-xs-3 col-key tr"><span class="pdr10"></span></div>
<div class="col-xs-9 col-val">
<button class="btn bgc-red" type="submit">提交</button>
</div>
</div>
</form>
var validor = new Valid();
validor.form($('#submitForm'), {
language: 'cn', // cn, hk, en
isAsync: true, // 同步,异步
isRenderCheckbox: true, // 是否渲染 checkbox
isRenderRadio: true, // 是否渲染 radio
isRenderSelect: true, // 是否渲染 select
scrollToError: false, // 出现错误时是否定位到错误高度
asyncFun: function() { // 验证通过时
ceng.msger('allow submit', 1)
},
errFun: function(){ // 验证不通过时
// ceng.msger('refuse and check', 0)
}
});