6

我正在尝试将我的 kendoDateTimePicker 配置为仅显示上午 9 点到下午 6 点。这可能吗?

4

4 回答 4

3
     var startDateReference = $('.startDate').kendoDateTimePicker({
        format: "dd-MM-yy HH:mm:ss",
        value : new Date(),
     }).data("kendoDateTimePicker");

     startDateReference.timeView.options.min = new Date(2000, 0, 1, 7, 30, 0);
     startDateReference.timeView.options.max = new Date(2000, 0, 1, 18, 00, 0);

这对我有用

于 2014-12-08T09:41:10.287 回答
2

使用 Kendo DateTimePicker,您可以选择日期minmax日期,但不能选择每天的时间范围,您可以使用TimePicker.

也许你可以分解你的用户界面,DatePicker然后TimePicker选择maxmin符合你的时间范围。

于 2013-01-24T12:16:46.283 回答
2

我知道这个问题被问到已经有一段时间了。但我会添加我的回复以供将来参考。

kendo DateTimePicker 不支持向 TimePicker 添加范围。但是您可以添加自己的小部件来执行此操作。

(function($) {
        var dateTimePicker = kendo.ui.DateTimePicker;

        var MyWidget = dateTimePicker.extend({

            init: function(element, options) {
                dateTimePicker.fn.init.call(this, element, options);
            },
            startTime: function(startTime) {
                var timeViewOptions = this.timeView.options;
                timeViewOptions.min = startTime;
                this.timeView.setOptions(timeViewOptions);
            },
            endTime: function(endTime) {
                var timeViewOptions = this.timeView.options;
                timeViewOptions.max = endTime;
                this.timeView.setOptions(timeViewOptions);
            },
            options: {
                name: "CustomDateTimePicker"
            }
        });

        kendo.ui.plugin(MyWidget);

    })(jQuery);

然后你可以CustomDateTimePicker这样称呼你:

var datePicker = $("#date-picker").kendoCustomDateTimePicker().data("kendoCustomDateTimePicker");
    datePicker.startTime("07:00");
    datePicker.endTime("11:00");

jsfiddle 演示。

于 2016-09-01T13:44:41.063 回答
1

我只是把这个技巧放在一起,因为我觉得日期时间选择器应该用于选择日期和时间,而不是有一个用于组成单个值的日期选择器和时间选择器的怪异 ui:

    $('#NewScheduledDateTime_timeview > li').each(function () {   

        bool removeTimeCondition = /* code to determine if time should be removed */

        if (removeTimeCondition)
            $(this).remove();
    })

列表的 id 会有所不同。要找到它,请使用您最喜欢的浏览器的开发工具展开时间列表和某个时间的“检查元素”。

我应该提一下,如果 Kendo UI 更新到较新版本,这很可能会中断。就像我说的,这是一个黑客。但是话又说回来,当我们尝试更新 Kendo UI 的版本时,即使是非 hacky 的东西也会中断。经验教训:不要使用 Kendo UI。

于 2014-08-20T14:54:28.703 回答