在jsp页面中定义如下的form表单(这是我从某一个项目中摘取的代码片段)
定义了一个form表单id是frmDataPath。
<form class="form-inline" style="margin: 15px" id="frmDataPath">
<div class="form-group">
<label for="trainDataPath"
style="display: block; float: left; width: 120px;"><fmt:message
key="资 源 库 路 径 " /> <%-- 训练数据路径 --%> </label>
<fmt:message key="colon" />
<input class="easyui-validatebox form-control" id="trainDataPath" type="text"
name="trainDataPath" data-options="validType:['filePath','length[1,200]'],required:true"/>
</div><br/><br/>
<div class="form-group">
<label for="trainCompletePath"
style="display: block; float: left; width: 120px;"><fmt:message
key="资源库照片路径 " /> <%-- 训练完成路径 --%> </label>
<fmt:message key="colon" />
<input class="easyui-validatebox form-control" id="trainCompletePath" type="text"
name="trainCompletePath" data-options="validType:['filePath','length[1,200]'],required:true"/>
</div><br/><br/>
<div class="form-group">
<label for="trainPath"
style="display: block; float: left; width: 120px;"><fmt:message
key="临 时 照 片 路 径 " /> <%-- 训练样本上传路径 --%> </label>
<fmt:message key="colon" />
<input class="easyui-validatebox form-control" id="trainPath" type="text"
name="trainPath" data-options="validType:['filePath'],required:true" />
</div><br/><br/>
<div class="form-group">
<label for="trainFail"
style="display: block; float: left; width: 120px;"><fmt:message
key="导入照片失败路径" /> <%-- 训练失败路径 --%> </label>
<fmt:message key="colon" />
<input class="easyui-validatebox form-control" id="trainFail" type="text"
name="trainFail" data-options="validType:['filePath','length[1,200]'],required:true"/>
</div>
<div class="form-group">
<a class="easyui-linkbutton" style="margin-left:100px"
data-options="iconCls:'icon-save',disabled:false"
id="btnSavePath" οnclick="saveResourcePath();"><fmt:message
key="保存" /> </a>
</div>
<br/><br/>
</form>
在被引用的js文件中定义相关验证规则,如下所示
$(function() {
$.extend($.fn.validatebox.defaults.rules,{
// 校验设备名称
custNameSearch : {
validator : function(value) {
return /^[a-zA-Z0-9]{1}([\u4E00-\u9FA5a-zA-Z0-9]|[-_])*$/
.test(value);
},
message : '最大32个汉字,允许汉字、字母、数字、“_”、“-”组合,必须以字母或者数字打头'
},
// 校验证件号
idNumSearch : {
validator : function(value) {
return /(^\d{1,15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
.test(value);
},
message : '请输入正确的身份证号!!!'
},
// 校验IP
addip : {
validator : function(value) {
return /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])((\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])){3}|(\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])){5})$/
.test(value);
},
message : 'ip格式不正确,应为IPV4,IPV6格式!'
},
// 校验端口
port : {
validator : function(value) {
return /^[1-9]$|(^[1-9][0-9]$)|(^[1-9][0-9][0-9]$)|(^[1-9][0-9][0-9][0-9]$)|(^[1-6][0-5][0-5][0-3][0-5]$)/
.test(value);
},
message : '只允许数字,范围从1-65535'
},
// 验证mac
addMac : {
validator : function(value) {
return /^[A-F0-9]{2}(-[A-F0-9]{2}){5}$/
.test(value);
},
message : '满足“XX-XX-XX-XX-XX-XX”格式,其中“XX”为两位十六进制数。'
},
// 检验高级参数配置的文件路径
filePath : {
validator : function(value) {
return /^[a-zA-Z]:((\\[0-9a-zA-Z\u4e00-\u9fa5\s]+)*)*\\$/
.test(value);
},
message : '请输入正确的文件夹路径 ,以\\结尾.例如“d:\\“或”e:\\demo\\“ '
},
threshold : {// 验证高级参数维护中的阈值
validator : function(value) {
return /^(?:[1-9][0-9]?|[1-9][0-9]|100)$/i
.test(value);
},
message : '阈值必须大于0小于等于100的整数'
},
//验证(0,100)的float型数据
frequency : {
validator : function(value) {
if(parseInt(value)!=value) {
return false;
}
if(value<0||value>=100) {
return false;
}
else if(/^[0-9]*[1-9][0-9]*$/.test(value)){
//^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$ 验证正浮点数
//^[0-9]+([.][0-9]{1}){0,1}$ 验证整数或者一位小数
return true;
}else
{return false;}
},
message : '频率必须是大于0小于100的整型 '
}
});
if(!$("#frmDataPath").form('validate')){
$.messager.alert("警告", "请您按照正确的格式输入", "warning");
return;
}
$.post(url, param, function(result) {
if (result.errorCode) {
$.messager.alert($.i18n.prop("messager.info"), $.i18n
.prop("submit.success"), "info");
} else {
$.messager.alert("错误", result.message, "error");
}
}, "json");
执行post请求之前,会验证表单的格式,若未通过则无法提交数据