如何限制 Kendo DateTimePicker 的开始和结束时间？ [复制]答案

【问题标题】：How can I constrain the start and end hours of the Kendo DateTimePicker? [duplicate]如何限制 Kendo DateTimePicker 的开始和结束时间？ [复制]
【发布时间】：2015-07-29 21:41:04
【问题描述】：

我在 ASP MVC 中使用 KendoUI DateTimePicker。当您选择时间选择器时，您将获得 00:00-24:00 的小时数。这对于人们滚动浏览来说很笨拙。我只想显示 08:00-16:00，任何一天。有可能这样做吗？这是我尝试过的。这失败了，因为它不是有效的日期时间。

                    @(Html.Kendo().DateTimePickerFor(x => x.HearingDate)
                      .Name("HearingDate")
                      .Min(new DateTime(0, 0, 0, 8, 0, 0))
                      .Max(new DateTime(0, 0, 0, 16, 0, 0))
                    )

编辑：一旦我明白 DateTimePicker 无法做到这一点，我选择的答案让我走上了正确的道路。这是我的解决方案，混合了 Kendo DatePickerFor 和 TimePickerFor。这花了很多时间才弄清楚，主要是因为我在使用 TimePicker 时遇到的问题。在我的项目中，日期和时间都允许为空。

型号

[Display(Name = "Hearing Date")]
public DateTime? HearingDate { get; set; }

[Display(Name = "Hearing Time")]
[DataType(DataType.Time)]
public DateTime? HearingTime { get; set; }

[Display(Name = "Hearing Date")]
public DateTime? HearingDateOnly { get; set; }

控制器

        if (model.HearingDateOnly != null && model.HearingTime != null)
        {
            var d = model.HearingDateOnly.Value;
            var t = model.HearingTime.Value;
            model.HearingDate = new DateTime(d.Year, d.Month, d.Day, t.Hour, t.Minute, t.Second);
        }

查看

                        @(Html.Kendo().DatePickerFor(x => x.HearingDateOnly)
                              .Name("HearingDateOnly")
                              .Min(DateTime.Now)
                              )

                        @(Html.Kendo().TimePickerFor(x => x.HearingTime)
                            .Name("HearingTime")
                            .Min(new DateTime(2010,1,1,8, 0, 0))
                            .Max(new DateTime(2010,1,1, 16, 0, 0))                                
                        )

注意事项： HearingDate 没有显示在视图上，我在幕后使用它来加入另外两个。最小值和最大值是 2010 年（任意）日期时间，但 Kendo 仅使用时间部分。我有一个 TimeSpan，但由于问题而将其删除。 Display 属性是防止 Kendo 的验证消息显示丑陋的“HearingTime 不是有效日期”消息所必需的。

【问题讨论】：

这不是重复的，因为这是与 MVC 包装器相关的，答案是 Kendo UI - Jquery。我确实有解决该问题的方法，应该在此处显示。 @(Html.Kendo().DateTimePickerFor(x => x.HearingDate) .Name("HearingDate") .Events(e => e.Open(@function(e){ if (e.view == = "时间") { e.sender.timeView.dataBind([ 新日期(1970, 0, 1, 9), 新日期(1970, 0, 1, 11), 新日期(1970, 0, 1, 13) ]) }}) ) )

标签： asp.net asp.net-mvc kendo-ui kendo-datetimepicker

【解决方案1】：

见https://stackoverflow.com/a/14501173/3250365。无法限制DateTimePicker 的时间范围，因此解决方法是从DatePicker 中分离出TimePicker。这还有其他缺点，但你可以这样做：

var t = $("#time-picker").kendoTimePicker().data("kendoTimePicker");

t.min("8:00 AM");
t.max("4:00 PM");

【讨论】：