kendoGrid 中的 TimePicker

Question

首先我知道这个帖子：datetimePicker Column in $("#grid").kendoGrid

但是我做错了什么。

我正在正确地从 api 获取数据，所以这不是问题。

这是我的模型：

            schema: {
                model: {
                    fields: {
                        shopID: "shopID",
                        shpWorkingHourID: "shpWorkingHourID",
                        scheduleDay: "scheduleDay",
                        workStartHour: "workStartHour",
                        workEndHour: "workEndHour",
                    }
                }
            }

我想要时间选择器 [prefix]Hours

columns: [
                    {
                        title: "shop",
                        field: "shopID"
                    },
                    {
                        field: "workEndHour",
                        editor: function (container, options) {
                            console.log(options);
                            var input = $("<input/>");
                            input.attr("workEndHour", options.workEndHour);

                            input.appendTo(container);

                            input.kendoDateTimePicker({});
                        }

                    },

即使我将 console.log 放入其中并且没有打印任何内容。我不知道我做错了什么。

//编辑： 即使我把： console.log('here') 紧跟在 function 之后也没有显示出来。

                field: "workEndHour",
                editor: function (container, options) {
                    console.log('here');
                    console.log(options);
                    var dateString = kendo.toString(options.model.workEndHour, "HH:mm");
                    var input = $("<input value=" + dateString + " />").appendTo(container);
                    $input.datepicker();
                    input.attr("workEndHour", options.model.scheduleDay);
                },
                title: "some title"

//编辑2： 问题可能出在日期格式上？我得到这样的：2000-01-01T00:00:00

Answer 1

尽管我将 console.log 放入其中，但没有打印任何内容

这是因为它是一个对象，您需要更具体一些。 这是有关选项对象的更多信息 https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.editor

您可以尝试通过以下方式查看/打印该对象的内容：

alert(JSON.stringify(options, null, 4));

确保您正确导入了所有剑道小部件：

 <script src="//kendo.cdn.telerik.com/2016.2.504/js/kendo.all.min.js"></script>

然后试试这个：

                                field: "workEndHour",
                                editor: function(container, options) {

                                var dateString = kendo.toString(options.model.workEndHour, "yyyy/MM/dd" );

                                var $input = $("<input value="+ dateString +" />").appendTo(container);
                                                    $input.datepicker();
                                },
                                title: "workEndHour",
                                //Specify format here. HH:mm maybe? I don't totally understand what you're trying with the hour perfix statement.
                                format: "{0:MM/dd/yyyy}"

以下是有关剑道日期/时间格式的更多信息： https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.format