项目中 用到了jquery的clone方法 使得出现很多歌name一样的文本框
数据验证用的jquery validate 这样就造成只能验证第一个文本框的情况
网上看了下 各个好的解决方案 亲身实践 优化后 总结如下:
//这个代码必须要引用
$(function(){
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;
});
}
}
//下面是表单验证规则 根据自己 项目属性进行更改
$("#formorders").validate();
$("[name=quantity]").each(function(){
$(this).rules("add", {
required: true,
digits:true,
messages: {
required: "数量不能为空",
digits:"请输入整数"
}
});
});
$("[name=descriptionstr]").each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "描述不能为空"
}
});
});
$("[name=price]").each(function(){
$(this).rules("add", {
required: true,
// regex: "^\d+(\.\d{2})?$" ,
number:true,
messages: {
required: "价格不能为空",
number:"请输入正确的价格格式"
}
});
// $(this).rules("add", { regex: "^\d+(\.\d{2})?$" })
});
// $("#Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$" })
$.validator.addMethod(
"regex",
function(value, element, regexp) {
var re = new RegExp(regexp);
return this.optional(element) || re.test(value);
},
"数据格式错误."
);
$("[name=loadingPort]").each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "请选择起运港"
}
});
});
$("[name=destinationPort]").each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "请选择目地港"
}
});
});
$("[name=paymentMethod]").each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "请选择支付方式"
}
});
});
$("[name=seller]").each(function(){
$(this).rules("add", {
required: true,
messages: {
required: "请选择供应商"
}
});
});
});
然后在克隆 方法里 增加动态修改id值得方法
$(".addProd").click(function() {
$("#clone").clone(true).insertAfter("#clone");
var idstr=0;
$("[name=quantity]").each(function(){
$(this).attr("id","quantity"+idstr);
idstr++;
});
var id_descriptionstr=0;
$("[name=descriptionstr]").each(function(){
$(this).attr("id","descriptionstr"+id_descriptionstr);
id_descriptionstr++;
});
var id_price=0;
$("[name=price]").each(function(){
$(this).attr("id","price"+id_price);
id_price++;
});
})
按钮用 <button class="btn btn-primary btn-lg mr-40" type="submit" id="submitBtn">创建订单</button>这种
文本框 随意 比如: <input name="quantity" value="" maxlength="9" class="form-control input65" type="text">
引用
<script type="text/javascript" src="/static/lib/jquery/core/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="common/js/plugin/validate/jquery.validate.js"></script>
这两个js即可
分享到:
相关推荐
自做的一个简单的表单验证 jquery validate 表单验证 jquery validate 表单验证
jQuery validate 验证 个性化验证
jquery.validate插件remote规则相同值不验证的问题解决办法.方法绝对有效
由于jquery.validate.js只针对元素name做了验证而没有针对元素ID进行验证,所以在使用jquery.validate插件http://jqueryvalidation.org/,当节点的name相同时候,脚本特意忽略剩余节点,导致所有相关节点的errMsg都...
主要介绍了jQuery Validate 校验多个相同name的方法,需要的朋友可以参考下
jquery validate 验证手册
jquery validate表单验证插件制作注册表单提交验证 jquery validate表单验证插件制作注册表单提交验证
10 equalTo:"#field" 输入值必须和 #field 相同。 11 accept: 输入拥有合法后缀名的字符串(上传文件的后缀)。 12 maxlength:5 输入长度最多是 5 的字符串(汉字算一个字符)。 13 minlength:10 输入长度最小是 10 ...
解决jquery validate remote 只验证一次的问题
jquery validate有很多验证规则,但是更多的时候,需要根据特定的情况进行自定义验证规则。 这里就来聊一聊jquery validate的自定义验证。 jquery validate有一个方法,可以让用户来自定义验证规则。 案例一: 代码...
jQuery Validate插件验证表单小练。
jquery validate例子 能用
jquery-validate 可对前端form进行表单校验,文档里详细介绍了如何使用jquery-validate框架和如何扩展验证方法。
Jquery validate和form两个插件,完美进行表单验证和Ajax无刷新方式提交form表单,很有用的哦。
NULL 博文链接:https://wwwzhouhui.iteye.com/blog/1068451
jquery validate 使用详解
Jquery validate表单验证Demo.zip Jquery validate表单验证Demo.zip Jquery validate表单验证Demo.zip Jquery validate表单验证Demo.zip Jquery validate表单验证Demo.zip
非常好的Jquery validate:每个案例独立,都有注释 讲解了: 环境搭建 常见验证方法配置 国际化错误消息 自定义方法和远程验证 给验证添加 图标效果
在项目中经常遇到,表单...如果用jquery validator ,它只支持验证第一个input,后面的name相同的input不会被验证,怎么办呐?经过研究源码,提出了解决办法。 基于jQuery Validation Plugin - v1.14.0 - 6/30/2015改造
JQuery validate中文详细文档