提问人:William 提问时间:8/8/2023 最后编辑:journpyWilliam 更新时间:8/11/2023 访问量:70
输入类型日期的自定义错误消息不起作用
Custom error message for input type date does not work
问:
我想为日期类型的输入创建自定义错误消息。规则是,输入是必需的。如果提供了输入,则输入应在 1920 年 1 月 1 日到去年(今天的日期减去一年)的范围内。我做了以下工作 这是我的输入字段:
<div class="form-group col-lg-5 desktop-margin">
<label for="DateofBirth" class="required-field">Date of birth</label>
<input id="dob" name="dob" type="date" class="form-control" value="@Model.DateofBirth" data-val="true" data-rule-required="true" data-val-required="Date of birth is required." data-rule-customdate="true" data-val-customdate="Invalid date.">
<div id="dobError" class="help-block field-validation-valid"></div>
</div>
这是我的jQuery:
$.validator.addMethod("customdate", function (value, element) {
// Convert the input value to a Date object
var selectedDate = new Date(value);
// Get today's date and calculate the date one year ago
var currentDate = new Date();
var oneYearAgo = new Date();
oneYearAgo.setFullYear(currentDate.getFullYear() - 1);
// Define the minimum and maximum allowed dates (1/1/1920 and today's date - 1 year)
var minDate = new Date("1920-01-01");
var maxDate = oneYearAgo;
console.log("selectedDate is: " + selectedDate + " minimum date is: " + minDate + " maximum date is: " + maxDate);
// Check the conditions and return the result
if (isNaN(selectedDate)) {
console.log("no date was provided");
createErrorSpan("Date of birth is required.");
return false; // Date is not valid
} else if (selectedDate > maxDate) {
console.log("date is big");
createErrorSpan("Date should occur before " + formatDate(maxDate) + ".");
return false; // Date is bigger than today's date - 1 year
} else if (selectedDate < minDate) {
console.log("date is small");
createErrorSpan("Date should occur after " + formatDate(minDate) + ".");
return false; // Date is less than 1/1/1920
}
return true; // Date is valid and meets all conditions
});
// Adapter for customdate validation method
$.validator.unobtrusive.adapters.add("customdate", function (options) {
options.rules["customdate"] = true;
options.messages["customdate"] = options.message;
});
$("#dob").on("input", function () {
var isValid = $("#MyForm").valid();
console.log("input is triggered and its: " + isValid);
if (isValid) {
if ($("#dobError").has("span").length > 0) {
$("#dobError").find("span").remove();
}
}
});
我注意到在添加日志后,除非我输入有效日期,否则不会触发“customdate”功能。例如,当日期为 2000 年 2 月 2 日时,只有在输入 2000 年的最后一个零后才会触发。输入 2033 年 2 月 2 日时永远不会触发。我错过了什么?
另外,有没有更好的方法来使用 $(“MyForm”).valid()?因为这将触发表单中所有字段的验证。
答: 暂无答案
评论
.valid()
addMethod()
function() { ... }
createErrorSpan