Time values aren't displayed when the grid shows up

[you]

Greetings !

We have this grid displaying two "time" columns with corresponding TimePickers. The TimePickers shows up right in edit mode but the values initially loaded from the database aren't displayed... So when the grid appears, the two time columns are empty.

The jobs.php controller returns time values formatted as "HH:mm:ss" so strings comes looking like "17:15:00"... and the Grid must display them without the seconds. "HH:mm"

01.    $("#grid").kendoGrid({
02.        editable:true,
03.        culture:"fr-FR",
04.        dataSource: {
05.            transport: {
06.                read: {
07.                    url: "./jobs.php",
08.                    dataType:"json",
09.                    data:{f_id: f_id, action:"read"}
10.                },
11.                create: {
12.                    url: "./jobs.php",
13.                    dataType:"json",
14.                    data:{f_id: f_id, action:"create"}
15.                },
16.                update: {
17.                    url: "./jobs.php",
18.                    dataType:"json",
19.                    data:{f_id: f_id, action:"update"}
20.                },
21.                destroy: {
22.                    url: "./jobs.php",
23.                    dataType:"json",
24.                    data:{f_id: f_id, action:"destroy"}
25.                }
26.
27.            },
28.            autoSync: true,
29.            error: function(e) {
30.                alert(e.responseText);
31.            },
32.            schema: {
33.                data: "data",
34.                model:{
35.                    id:"id",
36.                    fields: {
37.                        id: { editable: false },
38.                        start: {type:"date"/*validation: { required: true}*/ },
39.                        end: { type:"date"/*validation: { required: true}*/ },
40.                    }
41.                }
42.            }
43.        },
44.        columns: [
45.                  { field: "start", title:"Start", format: "{0: HH:mm}", editor:  timeEditor},
46.                  { field: "end", title:"End"  , format: "{0: HH:mm}", editor:  timeEditor},
47.                  {
48.                      command: "destroy"
49.                  }]
50.    });
51.
52.}
53.function timeEditor(container, options) {
54.    $('<input data-text-field="' + options.field + '" data-value-field="' + options.field + '" data-bind="value:' + options.field + '" data-format="' + options.format + '"/>')
55.            .appendTo(container)
56.            .kendoTimePicker({
57.                culture: "fr-FR",
58.                interval: "15",
59.                format: "HH:mm",
60.                min: new Date(2013, 6, 24, 0, 0, 0, 0),
61.                max: new Date(2013, 6, 24, 23, 59, 0, 0)
62.            });
63.}

[Vladimir Iliev]

Hi Sebastien,

 
Basically in order to display the time fields and edit them correctly you should return valid date (JSON) object from the server and set the format of the columns to display only the hours and minutes information.

Kind Regards,
Vladimir Iliev
Telerik