validate 动态验证 根据name值验证
来源:互联网 发布:mac黄皮适合口红颜色 编辑:程序博客网 时间:2024/06/06 06:41
直接添加验证
$('#form').validate({ rules:{ paramName:{ required:true }, paramRemark:{ required:true }, paramType:{ required:true }, constraintValues:{ required:true }, constraintCondition:{ required:true }, paramAttribute:{ required:true } }, messsages:{ paramName:{ required:"必填项" }, paramRemark:{ required:"必填项" }, paramType:{ required:"必填项" }, constraintValues:{ required:"必填项" }, constraintCondition:{ required:"必填项" }, paramAttribute:{ required:"必填项" } } });
动态添加验证 , 用add
$("#paramValue").rules("add",{required:true});
if(max){ $("#paramValue").rules("add",{required:true, range: [min,max]}); } else { $("#paramValue").rules("add",{required:true}); }
根据name值验证,这儿借鉴了网上的方法点击打开链接,原作者说了两种方法,修改源文件和在当前js加判断 两种方法
这儿采用的是不修改源文件的情况下验证,首先要初始化添加一个判断
//validate 根据name验证 不修改源码 if ($.validator) { $.validator.prototype.elements = function () { var validator = this, rulesCache = {}; // select all valid inputs inside the form (no submit or reset buttons) return $(this.currentForm) .find("input, select, textarea") .not(":submit, :reset, :image, [disabled]") .not(this.settings.ignore) .filter(function () { if (!this.name && validator.settings.debug && window.console) { console.error("%o has no name assigned", this); } //注释这行代码 // select only the first element for each name, and only those with rules specified //if ( this.name in rulesCache || !validator.objectLength($(this).rules()) ) { // return false; //} rulesCache[this.name] = true; return true; }); } }添加过判断之后,就可以添加验证
其中constraintValues为form表单中input框的name值,这样就把所有name为constraintValues的input框全部添加验证
$('#form').validate({ rules:{ constraintValues:{ required:true } }, messages:{ constraintValues:{ required:"必填项" } } });
顺便贴上整个页面供参考
<%@ page contentType="text/html;charset=UTF-8" language="java" %><%@include file="../../base/taglib.jsp" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><!-- Head --><head> <%@include file="../../base/headerLink.jsp" %> <%@include file="../../base/headerLink.jsp" %></head><!-- /Head --><!-- Body --><body><div class="main-container container-fluid"> <div class="row"> <form:form id="form" method="post" class="form-horizontal" role="form" commandName="profile"> <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="widget"> <div class="widget-body"> <div class="form-group" hidden="true"> <form:label path="sysParamId" class="col-lg-4 control-label">参数ID</form:label> <div class="col-lg-4"> <c:if test="${profile.sysParamId!=null}"> <form:input type="text" class="form-control" readonly="true" path="sysParamId"/> </c:if> <c:if test="${profile.sysParamId==null}"> <form:input type="text" class="form-control" path="sysParamId"/> </c:if> </div> </div> <div class="form-group"> <form:label path="paramName" class="col-lg-4 control-label">参数名称</form:label> <div class="col-lg-4"> <c:if test="${profile.paramName!=null}"> <form:input type="text" class="form-control" readonly="true" data-validatebox="validType:['required']" path="paramName"/> </c:if> <c:if test="${profile.paramName==null}"> <form:input type="text" class="form-control" data-validatebox="validType:['required']" path="paramName"/> </c:if> </div> </div> <div class="form-group"> <form:label path="paramValue" class="col-lg-4 control-label">参数值</form:label> <div class="col-lg-4"> <c:if test="${list != null}"> <form:select class="form-control" path="paramValue"> <form:options items="${list}"></form:options> </form:select> </c:if> <c:if test="${list == null}"> <form:input type="text" class="form-control" path="paramValue"/> </c:if> </div> </div> <div class="form-group"> <form:label path="constraintValue" class="col-lg-4 control-label">约束值</form:label> <c:if test="${profile.constraintValue==null}"> <input type="button" onclick="add()" value="添加" id="addId" hidden="true" /> </c:if> <div class="col-lg-4" id="value"> <c:if test="${profile.constraintValue!=null}"> <form:input type="text" class="form-control" readonly="true" path="constraintValue"/> </c:if> <%-- <c:if test="${profile.constraintValue==null}"> <form:input type="text" class="form-control" path="constraintValue"/> </c:if> --%> </div> </div> <div class="form-group"> <div class="col-sm-10"> <button type="submit" class="btn btn-blue btn-sm">${op}</button> <button type="button" onclick="window.history.go(-1);" class="btn btn-blue btn-sm">返回 </button> </div> </div> </div> </div> </div> <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="widget"> <div class="widget-body"><div class="form-group"> <form:label path="paramRemark" class="col-lg-4 control-label">参数备注</form:label> <div class="col-lg-4"> <c:if test="${profile.paramRemark!=null}"> <form:input type="text" class="form-control" readonly="true" path="paramRemark"/> </c:if> <c:if test="${profile.paramRemark==null}"> <form:input type="text" class="form-control" path="paramRemark"/> </c:if> </div> </div> <div class="form-group"> <form:label path="paramType" class="col-lg-4 control-label">参数类型</form:label> <div class="col-lg-4"> <c:if test="${profile.paramType!=null}"> <form:select class="form-control" disabled="true" path="paramType"> <form:option value="1">字符串</form:option> <form:option value="2">整型</form:option> <form:option value="3">日期型</form:option> <form:option value="4">浮点型</form:option> </form:select> </c:if> <c:if test="${profile.paramType==null}"> <form:select class="form-control" path="paramType"> <form:option value="1">字符串</form:option> <form:option value="2">整型</form:option> <form:option value="3">日期型</form:option> <form:option value="4">浮点型</form:option> </form:select> </c:if> </div> </div> <div class="form-group"> <form:label path="constraintCondition" class="col-lg-4 control-label">约束条件</form:label> <div class="col-lg-4"> <c:if test="${profile.constraintCondition!=null}"> <form:select class="form-control" disabled="true" path="constraintCondition"> <form:option value="1">取值范围</form:option> <form:option value="2">特殊取值</form:option> </form:select> </c:if> <c:if test="${profile.constraintCondition==null}"> <form:select class="form-control" path="constraintCondition" id="constraintCondition"> <form:option value="1">取值范围</form:option> <form:option value="2">特殊取值</form:option> </form:select> </c:if> </div> </div> <div class="form-group"> <form:label path="paramAttribute" class="col-lg-4 control-label">权限</form:label> <div class="col-lg-4"> <c:if test="${profile.paramAttribute!=null}"> <form:select class="form-control" disabled="true" path="paramAttribute"> <form:option value="1">可见可编辑</form:option> <form:option value="2">可见不可编辑</form:option> <form:option value="3">不可见</form:option> </form:select> </c:if> <c:if test="${profile.paramAttribute==null}"> <form:select class="form-control" path="paramAttribute"> <form:option value="1">可见可编辑</form:option> <form:option value="2">可见不可编辑</form:option> <form:option value="3">不可见</form:option> </form:select> </c:if> </div> </div> </div> </div> </div> </form:form> </div> <%@include file="../../base/footerLink.jsp" %> <script src="<c:url value='/static/module/JQuery zTree v3.5.15/js/jquery.ztree.all-3.5.min.js'/>"></script> <script src="<c:url value='/static/assets/js/validation/jquery.validate.min.js'/>"></script> <%-- <script src="<c:url value='/static/assets/js/validation/prototype_for_validation.js'/>"></script> <script src="<c:url value='/static/assets/js/validation/validation_cn.js'/>"></script> --%> <script> var max = '${max}', min = '${min}', list = '${list}'; $(function () { //validate 根据name验证 不修改源码 if ($.validator) { $.validator.prototype.elements = function () { var validator = this, rulesCache = {}; // select all valid inputs inside the form (no submit or reset buttons) return $(this.currentForm) .find("input, select, textarea") .not(":submit, :reset, :image, [disabled]") .not(this.settings.ignore) .filter(function () { if (!this.name && validator.settings.debug && window.console) { console.error("%o has no name assigned", this); } //注释这行代码 // select only the first element for each name, and only those with rules specified //if ( this.name in rulesCache || !validator.objectLength($(this).rules()) ) { // return false; //} rulesCache[this.name] = true; return true; }); } } //初始化验证 $('#form').validate({ rules:{ paramName:{ required:true }, paramRemark:{ required:true }, paramType:{ required:true }, constraintValues:{ required:true }, constraintCondition:{ required:true }, paramAttribute:{ required:true } }, messsages:{ paramName:{ required:"必填项" }, paramRemark:{ required:"必填项" }, paramType:{ required:"必填项" }, constraintValues:{ required:"必填项" }, constraintCondition:{ required:"必填项" }, paramAttribute:{ required:"必填项" } } }); //为参数值添加动态验证 if(max){ $("#paramValue").rules("add",{required:true, range: [min,max]}); } else { $("#paramValue").rules("add",{required:true}); } //动态验证 动态添加的input输入框 根据name添加验证 $("#value").delegate("input","change",function(){ $('#form').validate({ rules:{ constraintValues:{ required:true } }, messages:{ constraintValues:{ required:"必填项" } } }); }) if('${op}'=='新增'){ add(); add(); } //约束条件改变时触发事件 $('#constraintCondition').change(function(){ //将已添加的input框移除掉 $('#value').empty(); if($('#constraintCondition').val()==1){//取值范围 $('#addId').hide(); add(); add(); } else if($('#constraintCondition').val()==2){//特殊取值 $('#addId').show(); add(); } }) }) //动态添加input框 function add(){ var input1 = document.createElement('input'); input1.setAttribute('type', 'text'); input1.setAttribute('name', 'constraintValues'); //input1.setAttribute('path', 'constraintValue'); input1.setAttribute('form', 'form'); input1.setAttribute('class', 'form-control'); var btn1 = document.getElementById("value"); btn1.insertBefore(input1,null);} </script></body><!-- /Body --></html>
阅读全文
0 0
- validate 动态验证 根据name值验证
- jquery validate name验证问题
- 根据jquery validate验证插件改写
- jquery 的validate 动态添加验证规则 及 jquery选择器 name带变量
- jQuery validate 根据上下文条件动态给字段添加或删除验证选项?
- validate验证
- validate验证
- jquery validate 动态增加删除验证规则
- jquery validate 动态添加验证信息
- jquery validate 动态增加删除验证规则
- struts-Validate框架(验证动态ActionForm)
- jquery.validate.js,多个name属性相同的验证
- 关于JQUERY.VALIDATE.JS 验证能用name还是id
- jquery validate 多个相同name的文本框验证
- Jquery validate验证表单时多个name相同的元素
- jquery-validate动态添加表单元素动态验证
- jquery validate不能验证多个相同的Name 只验证第一个的方案
- Jquery validate验证表单时多个name相同的元素只验证第一个的问题
- webstorm配置node环境
- JDBC---PreparedStatement 批处理(二)
- JS实现图片预加载
- 国产化网管实现方案
- Integer自动装箱超出赋值范围
- validate 动态验证 根据name值验证
- Java的网络编程
- mtr命令详解诊断网络路由
- 31、不一样的C++系列--多重继承
- import java.***** cannot be resolved
- mysql5.7全/增量备份脚本
- Java全局变量
- 关于url转编码的问题
- android6.0的apk更新