在以前的数据选择器的基础上设置Kendo数据选择器
我有两个Kendo数据选择器，'OvertimeDateFrom‘和'OvertimeDateTo’，用户必须选择它们才能完成加班请求。当用户从“OvertimeDateFrom”中选择日期和时间时，我希望将'OvertimeDateTo‘设置为相同的日期，但允许它的时间值保持可选性。
我试过在“.Max(DateTime.MaxValue)”和“.Max(DateTime.Today)”上使用OvertimeDateTo，但是这并没有将日期限制在“OvertimeDateFrom”的日期。
<script>
function startChange() {
var endPicker = $("#OvertimeDateTo").data("kendoDateTimePicker"),
startDate = this.value();
if (startDate) {
startDate = new Date(startDate);
startDate.setDate(startDate.getDate() + 0);
endPicker.min(startDate);
}
}
function endChange() {
var startPicker = $("#OvertimeDateFrom").data("kendoDateTimePicker"),
endDate = this.value();
if (endDate) {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate());
startPicker.max(endDate);
}
}<div class="col-md-10">
@(Html.Kendo().DateTimePicker()
.Name("OvertimeDateFrom")
//.Value(DateTime.MaxValue)
//.Min(DateTime.MinValue)
//.Max(DateTime.MaxValue)
.ParseFormats(new string[] { "dd/MM/yyyy" })
.Events(e => e.Change("startChange"))
.HtmlAttributes(new { @class = "form-control", style = "width:100%;" })
)
@Html.ValidationMessageFor(model => model.OvertimeDateFrom)
</div>
@(Html.Kendo().DateTimePicker()
.Name("OvertimeDateTo")
.Value(DateTime.MaxValue)
.Min(DateTime.MinValue)
.Max(DateTime.MaxValue)
.ParseFormats(new string[] { "dd/MM/yyyy" })
.Events(e => e.Change("endChange"))
.HtmlAttributes(new { @class = "form-control", style = "width:100%;" })
)
@Html.ValidationMessageFor(model => model.OvertimeDateTo)我也尝试过使用元数据类来验证这方面的日期，但只有必需的工作，AssertThat不能工作。
[Required(ErrorMessage = "Please Complete")]
[DataType(DataType.DateTime)]
[Display(Name = "OvertimeDateFrom")]
public DateTime OvertimeDateFrom { get; set; }
[Required(ErrorMessage = "Please Complete")]
[AssertThat("OvertimeDateTo <= Today()", ErrorMessage = "Date Processed cannot be a date that is in the future.")]
[AssertThat("OvertimeDateTo >= OvertimeDateFrom", ErrorMessage = "Date Processed cannot be before Date Received.")]
[DataType(DataType.DateTime)]
[Display(Name = "OvertimeDateTo")]
public DateTime OvertimeDateTo { get; set; }回答 1
Stack Overflow用户
发布于 2022-04-21 16:54:45
对于任何遇到相同问题的人，我都会通过比较我的函数中的两个日期来解决这个问题，参见下面。
“endChange”函数只比较来自“OvertimeDateFrom”和“OvertimeDateTo”的日期，但仍然允许选择时间。如果'OvertimeDateTo‘的日期大于'OvertimeDateFrom’，那么'OvertimeDateTo‘就会自动失去它的值。如果日期相同，但时间更长，这是应该的，那么这是可以接受的。一旦“OvertimeDateTo”被清空，元数据类验证就会启动，以防止用户保存请求，因为它是必需的字段。
function endChange() {
var startPicker = $("#OvertimeDateFrom").data("kendoDateTimePicker"),
endDate = this.value();
var startValue = $("#OvertimeDateFrom").data("kendoDateTimePicker").value();
if (endDate.getDate() > startValue.getDate()) {
alert("You can't select an end date greater than start date");
**/*clear field automatically if end date is greater*/**
$("#OvertimeDateTo").data('kendoDateTimePicker').value("")
}
else {
endDate = new Date(endDate);
endDate.setDate(endDate.getDate());
startPicker.max(endDate);
}
}https://stackoverflow.com/questions/71953993
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号