Kendo UI datepicker 不会清除之前的最小和最大日期答案

【问题标题】：Kendo UI datepicker does not clear previous min and max dateKendo UI datepicker 不会清除之前的最小和最大日期
【发布时间】：2013-10-25 12:30:23
【问题描述】：

我正在使用带有 kendo UI 的 MVC4 剃须刀应用程序。在我的项目中，我们使用了两个 kendo 日期选择器控件来显示页面中的开始日期和结束日期。当用户从“ApplicationDateFrom”选择器中选择一个日期时，我们将“ApplicationDateTo”的最小值设置为“ApplicationDateFrom”选择器的日期。如果用户从“ApplicationDateTo”选择器中选择一个值，我们将“ApplicationDateFrom”选择器的最大值设置为“ApplicationDateTo”选择器的值。

我的问题是，当用户从“ApplicationDateFrom”和“ApplicationDateTo”日历中选择值后，从“ApplicationDateFrom”和“ApplicationDateTo”日期选择器文本框字段中清除与日历相关的值时，“ApplicationDateFrom”和“ ApplicationDateTo" 日历显示先前设置的最小值和最大值。

这里是代码

@(Html.Kendo().DatePickerFor(o => o.ApplicationDateFrom)
.Events(e=>e.Change("onApplicationFromDateChange"))
.HtmlAttributes(new { type = "text", placeholder = "MM/DD/YYYY", @class="span6" }))

@(Html.Kendo().DatePickerFor(o => o.ApplicationDateTo)
.Events(e=>e.Change("onApplicationToDateChange"))
.HtmlAttributes(new { type = "text", placeholder = "MM/DD/YYYY", @class="span6" }))

<script>
function onApplicationFromDateChange() {
var endPicker = $("#ApplicationDateTo").data("kendoDatePicker"), startDate = this.value();
if (startDate) {
        startDate = new Date(startDate);
        startDate.setDate(startDate.getDate());
        endPicker.min(startDate);
    }
}       

function onApplicationToDateChange() {
var startPicker = $("#ApplicationDateFrom").data("kendoDatePicker"), endDate = this.value();
if (endDate) {
        endDate = new Date(endDate);
        endDate.setDate(endDate.getDate());
        startPicker.max(endDate);
    }
}</script>

请提供解决方案。任何帮助表示赞赏。

【问题讨论】：

您的第二段令人困惑。 This 演示很简单。你到底想要什么？
当用户清除附在日历上的两个文本框时，我想重置两个日历。

标签： jquery asp.net-mvc asp.net-mvc-4 telerik kendo-ui

【解决方案1】：

如果用户清除文本框并将其聚焦，则在解析日期字符串时触发 Change 事件。您可以管理以下内容：

<script>
function onApplicationFromDateChange() {
var endPicker = $("#ApplicationDateTo").data("kendoDatePicker"), startDate = this.value();
if (startDate) {
        startDate = new Date(startDate);
        startDate.setDate(startDate.getDate());
        endPicker.min(startDate);
    }
else if(!endPicker.value()){   // You said both
   endPicker.min(new Date(1900, 0, 1)); // Setting defaults
   endPicker.max(new Date(2099, 11, 31));
   this.min(new Date(1900, 0, 1));
   this.max(new Date(2099, 11, 31));
}
}       

function onApplicationToDateChange() {
var startPicker = $("#ApplicationDateFrom").data("kendoDatePicker"), endDate = this.value();
if (endDate) {
        endDate = new Date(endDate);
        endDate.setDate(endDate.getDate());
        startPicker.max(endDate);
    }
else if(!startPicker.value()){
       startPicker.min(new Date(1900, 0, 1)); // Setting defaults
       startPicker.max(new Date(2099, 11, 31));
       this.min(new Date(1900, 0, 1));
       this.max(new Date(2099, 11, 31));
}
}</script>

有点丑。我宁愿使用外部元素（即按钮）来重置最小/最大值。

【讨论】：