使用jQuery验证器验证两个字段
用户名
我想使用验证器插件方法来验证两个字段，例如传递标记始终小于完整标记。
注意：：“我的HTML字段”是动态的，因此请勿将其视为单个字段。
这是在我的HTML字段下方。
<td>
<div class="form-group">
<input type="text" name="fmark_<?php echo $value['id'] ?>" class="form-control" id="fmark_<?php echo $value['id'] ?>" value="<?php echo $value['full_marks'] ?>" placeholder="Enter Full Marks">
</div>
</td>
<td>
<div class="form-group">
<input type="text" name="pmarks_<?php echo $value['id'] ?>" class="form-control" id="pmarks_<?php echo $value['id'] ?>" value="<?php echo $value['passing_marks'] ?>" placeholder="Enter Passing Marks">
</div>
</td>
这是我的jquery验证器。
$('input[id^="fmark_"]').each(function () {
$(this).rules('add', {
required: true,
messages: {
required: "Required"
}
});
});
$('input[id^="pmarks_"]').each(function () {
$(this).rules('add', {
required: true,
messages: {
required: "Required"
}
});
});
罗伯·S。
使用jQueryValidate，可以通过创建类似以下示例的验证器轻松完成此操作。（您可能希望有一种更好的方法来将fmark id设置为变量“ id”。编写代码的方式必须分析文本以匹配不理想的id。）
$.validator.addMethod("lessThanFullMarks",
function (value, event, params) {
var id = 'fmark_'+params;
return parseInt(value) < parseInt($('#'+id).val()); });
});
然后要使用它，只需将其添加到规则和消息中，就像这样。
$('input[id^="fmark_"]').each(function () {
$(this).rules('add', {
required: true,
messages: {
required: "Required"
}
});
});
$('input[id^="pmarks_"]').each(function () {
$(this).rules('add', {
required: true,
lessThanFullMarks: ["<PUT THE MATCHING FULL MARK ID HERE>"],
messages: {
required: "Required",
lessThanFullMarks: "Must be greater than Full Marks."
}
});
});
只是我个人的喜好，但我认为将规则应用于表单比在匹配的选择器上运行每个规则更简洁，更灵活。这是我其中一个项目的示例。
$("#createContractForm").validate({
rules: {
Name: {
required: true,
maxlength: 50
},
ContractNumber: {
required: true,
maxlength: 100
},
InitialValue: {
required: true,
minlength: 1,
number: true
},
SourcingDate: {
required: true,
validDate: true,
date: true
},
EffectiveDate: {
required: true,
validDate: true,
date: true,
greaterThanSourcingDate: true
},
EndDate: {
required: true,
validDate: true,
date: true,
greaterThanEffectiveDate: true
},
ChampionId: {
required: true
},
CategoryId: {
required: true
},
SubcategoryId: {
required: true
},
Details: {
required: true
},
ClientId: {
required: true
},
ClientRegionId: {
required: true,
remote: {
url: $("#urlContractExists").data("request-url"),
type: "post",
data: {
ClientId: function () {
return $("#ClientId").val();
},
ClientRegionId: function () {
return $("#ClientRegionId").val();
},
CategoryId: function () {
return $("#CategoryId").val();
},
SubcategoryId: function () {
return $("#SubcategoryId").val();
},
SupplierId: function () {
return $("#SupplierId").val();
},
SupplierRegionId: function () {
return $("#SupplierRegionId").val();
}
}
}
},
SupplierId: {
required: true
},
SupplierRegionId: {
required: true,
remote: {
url: $("#urlContractExists").data("request-url"),
type: "post",
data: {
ClientId: function () {
return $("#ClientId").val();
},
ClientRegionId: function () {
return $("#ClientRegionId").val();
},
CategoryId: function () {
return $("#CategoryId").val();
},
SubcategoryId: function () {
return $("#SubcategoryId").val();
},
SupplierId: function () {
return $("#SupplierId").val();
},
SupplierRegionId: function () {
return $("#SupplierRegionId").val();
}
}
}
}
},
messages: {
Name: {
required: "Contract Name is required"
},
ContractNumber: {
required: "Contract Number is required"
},
InitialValue: {
required: "Initial Value is required",
number: "Initial Value must be a number"
},
SourcingDate: {
required: "Sourcing Date is required",
date: "Sourcing Date must be a valid date"
},
EffectiveDate: {
required: "Effective Date is required",
date: "Effective Date must be a valid date",
greaterThanSourcingDate: "Effective Date must be greater than the Sourcing Date"
},
EndDate: {
required: "End Date is required",
date: "End Date must be a valid date",
greaterThanEffectiveDate: "End Date must be greater than the Effective Date"
},
ChampionId: {
required: "A Champion is required"
},
CategoryId: {
required: "A Category is required"
},
SubcategoryId: {
required: "A Subcategory is required"
},
Details: {
required: "Deatils are required"
},
ClientId: {
required: "Client is required"
},
ClientRegionId: {
required: "Client Region is required",
remote: "Contract for the same Category, Subcategory, Client Region, and Supplier Region already exists."
},
SupplierId: {
required: "Supplier is required"
},
SupplierRegionId: {
required: "Supplier Region is required",
remote: "Contract for the same Category, Subcategory, Client Region, and Supplier Region already exists."
}
},
highlight: function (element) {
$(element).closest(".form-group").addClass("has-error");
},
unhighlight: function (element) {
$(element).closest(".form-group").removeClass("has-error");
},
errorElement: "span",
errorClass: "help-block",
errorPlacement: function (error, element) {
if (element.parent(".input-group").length) {
error.insertAfter(element.parent());
} else {
error.insertAfter(element);
}
}
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
编辑于
相关文章
TOP 榜单
- 1
Android Studio Kotlin：提取为常量
- 2
IE 11中的FormData未定义
- 3
计算数据帧R中的字符串频率
- 4
如何在R中转置数据
- 5
如何使用Redux-Toolkit重置Redux Store
- 6
Excel 2016图表将增长与4个参数进行比较
- 7
在 Python 2.7 中。如何从文件中读取特定文本并分配给变量
- 8
未捕获的SyntaxError：带有Ajax帖子的意外令牌u
- 9
OpenCv：改变 putText() 的位置
- 10
ActiveModelSerializer仅显示关联的ID
- 11
算术中的c ++常量类型转换
- 12
如何开始为Ubuntu开发
- 13
将加号/减号添加到jQuery菜单
- 14
去噪自动编码器和常规自动编码器有什么区别？
- 15
获取并汇总所有关联的数据
- 16
OpenGL纹理格式的颜色错误
- 17
在 React Native Expo 中使用 react-redux 更改另一个键的值
- 18
http：// localhost：3000 /＃！/为什么我在localhost链接中得到“＃！/”。
- 19
TreeMap中的自定义排序
- 20
Redux动作正常，但减速器无效
- 21
如何对treeView的子节点进行排序
我来说两句