剑道时间选择器中的格式错误答案

【问题标题】：Wrong format in Kendo Time Picker剑道时间选择器中的格式错误
【发布时间】：2017-05-15 13:51:03
【问题描述】：

HTML

<input id="timepicker" />

KendoTimePicker(javascript)

$("#timepicker").kendoTimePicker({
                        format: "HH:mm",
                        change: function () {
                            var value = this.value();
                            console.log("value is the selected date in the timepicker");
                            console.log(value);
                            alert(value);
                        }
  });

现在，我的问题是当我更改 KendoTimePicker 值时，它不是采用 HH:mm 格式，而是采用以下格式：

2017 年 5 月 15 日星期一 07:00:00 GMT+0530（印度标准时间）

请点击这里：JS Fiddle Url

【问题讨论】：

标签： javascript jquery asp.net asp.net-mvc kendo-ui

【解决方案1】：

通过default，this.value() 将表示为 Javascript Date 的一个实例。

但是，您可以通过使用各种不同的方法从value 中提取具体的时间值：

getHours
getMinutes
getUTCHours（如果根据 UTC 需要时间）
toLocaleTimeString（如果特定地区需要时间）
moment.js 插件（这将是我个人最喜欢的） - 在下面包含一个小 sn-p：

var result = moment().format('hh:mm');
alert(result);

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案2】：

需要解析成字符串：

var data = [];
$("#timepicker").kendoTimePicker({
    change: function() {
            alert(kendo.toString(this.value(),"hh:mm tt"))
    }
});

注意：在格式中使用 tt 来显示 AM/PM。有 tt -> 02:30 AM，没有 -> 02:30。此外，如果你想要 0 - 24 sacale 使用 HH:mm 格式。

Fiddle

【讨论】：

谢谢。我已经尝试过了，但在控制器中，我仍然得到这种格式：Mon May 15 2017 07:00:00 GMT+0530 (India Standard Time)

【解决方案3】：

我在从 kendoTimePicker 中选择时间值并选择 (onBlur) 值进入格式后遇到了同样的问题

  Mon May 15 2017 07:00:00 GMT+0530 (India Standard Time)

所以这就是修复

div 网格中的单元格定义 (timeShowinghtml.cfm)

{ 'field': 'starttime', 'title': 'Start Time', 'width': 120,'editor': editorStartTimeGrid,'format': '{0:HH:mm tt}' }

modelJsForGrid.js

function editorStartTimeGrid(container, options) { $('')

 .appendTo(container);
 $('#txtStartTimeGrid').kendoTimePicker({
    parseFormats: ["0", "hh:mm tt"],
    animation: false,
    interval: 15,
    format: "hh:mm tt"
 });

我只在我的网格的 kendo ViewModel 定义中显示 getDataChanges 事件

getDataChanges: function() {
    var retData = [];
    jQuery.each(this.dsGridEquipment.data(), function(index, item) {

        if (item.dirty) {
            //this line converts the javaScript timestamp back to time only string
            item.starttime = toLocalTimeString(item.starttime);
            retData.push(item);
        }
    }); 
    return retData;
},

【讨论】：