
I currently have a template that displays a date (among other things). When I was initially setting this up, I was told to use "#= kendo.toString(kendo.parseDate(data.CompletedDate), 'dd-MMM-yyyy') #" to display this date in the required format, which works perfectly.
Now I am attempting to move that date formatting into the datasource, in anticipation of future functionality. I found the dataSource -- schema -- parse functionality and thought it would work for what I wanted, but the formatting isn't actually working.
Datasource:
var
datasource =
new
kendo.data.DataSource({
transport: {
read: {
type:
"GET"
,
url:
"/MainController.cfc?method=getCourses"
,
processData:
true
,
dataType:
"json"
,
data: {
CourseData: JSON.stringify(course_data)
}
}
},
schema : {
type:
"json"
,
data:
"Courses"
,
parse:
function
(data) {
$.map(data,
function
(item, index) {
if
(
typeof
(item.Due) !==
"undefined"
&& item.Due !=
null
) {
item.Due = kendo.parseDate(item.Due,
"dd-MMM-yyyy"
);
}
});
return
data;
}
}
});
Here's a sample of the JSON being returned to the datasource:
{
"Courses"
:[{
"HasTasks"
:1,
"EnrollmentSubscription"
:0,
"IncompletePrereqs"
:0,
"AllowReenroll"
:0,
"GradeDisplay"
:1,
"CompletionAccess"
:1,
"EnrollType"
:
"Enrolled"
,
"Due"
:
"07\/23\/2015"
,
"CompletedDate"
:
""
,
"SelfEnrollCount"
:0,
"EnrolledBy"
:331786,
"HasAssessment"
:0,
"SubscriptionExpired"
:0,
"Completed"
:0,
"EnrollmentGroup"
:0,
"DueStatus"
:
""
,
"Tag"
:
""
,
"Type"
:
"Online"
,
"PreviouslyComplete"
:1,
"Certificate"
:1,
"Name"
:"Completed (Auto re-enroll
)
","
Grade
":"
","
Started
":1,"
Progress
":0.0,"
Image
":"
","
AULMRID
":501507,"
MergeDoc
":0,"
Passed
":0,"
LearningModuleID"
:20437,
"CourseID"
:5570,
"ExpirationAccess"
:1}]}
When the template is displayed, the date is showing in mm/dd/yyyy format, not the specified dd-MMM-yyyy format. I copied the format string directly from the template code, so what's the problem?
9 Answers, 1 is accepted


var
dataSource =
new
kendo.data.DataSource({
data: data,
schema: {
model: {
fields: {
Due: { type:
'date'
},
}
}
}
});


Okay I understand what you're trying to do... you need to format the column not the data.
$(
"#grid"
).kendoGrid({
dataSource: dataSource,
columns: [
{ field:
'Due'
, title:
"Due Date"
, format:
"{0:dd/MM/yyyy}"
}]
});

Hello shimmoril,
If I understood your question correctly, you want to re-format the date displayed using the schema parse function. In order to do so, you will need to first use the kendo.parseDate to parse the date and kendo.toString to produce a string in the appropriate format. The pasted code can be changed similar to the following:
$.map(data,
function
(item, index) {
if
(
typeof
(item.Due) !==
"undefined"
&& item.Due !=
null
) {
item.Due = kendo.toString(kendo.parseDate(item.Due),
"dd-MMM-yyyy"
);
}
});
Rosen
Telerik

Thanks for the reply, but I've tried that and it gives me the date in the mm/dd/yyyy format (which is the format being passed to the datasource).
You can see it happening here: http://app.smarteru.com/custom/kendo/index.cfm
Notice the difference between the tile and list views. Even though they share a datasource, the list view template is still doing kendo.toString(kendo.parseDate(data.Due), "dd-MMM-yyyy"); whereas the tile view just has #= data.Due # and it's not being formatted correctly.
Hello shimmoril,
The value of the field is not changed in this case, as the map is not applied on the correct object. The parse method receives the entire response, not only the data portion, thus in your scenario you will need to process the Courses field :
parse:
function
(data) {
var
courses = data.Courses;
$.map(courses,
function
(item, index) {
if
(item.Due !=
null
) {
item.Due = kendo.toString(kendo.parseDate(item.Due),
"dd-MMM-yyyy"
)
}
});
return
data;
}
Rosen
Telerik
