kendoGrid中的TimePicker

时间:2018-09-06 13:56:10

标签: jquery kendo-grid

首先,我知道这个线程:datetimePicker Column in $("#grid").kendoGrid

但是可能是我在做错什么。

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

这是我的模特:

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

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

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')也不会显示。

                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"

// EDIT2: 问题可能出在日期格式上?我是这样的:2000-01-01T00:00:00

1 个答案:

答案 0 :(得分:0)

  

虽然我把console.log放进去了,但是什么也没打印

这是因为它是一个对象,您需要更加具体。 这是有关options对象的更多信息 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