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"
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.
}