Culture Date Formatting Breaking Template

[Ashleigh L]

I'm working on getting an isolated example up and running, but maybe there's something obvious I'm missing.

We've got a SPA w/ multiple views, most of which are generated via templates. We're using Kendo charts, the scheduler and upload widgets in these views, which were all working fine until we implemented the kendo.culture functionality.

Users can switch between English and French (Canadian). In English our tile view template looks fine (screenshot 1.png), but when we switch to French, all the overlays are lost (screenshot 2.png. Other items on different views also disappear, including buttons and general text. The one common point seems to be the if statements in the template for all these elements are checking for the existence of a date, like so:

# if (typeof(data.Due) !== "undefined" && data.Due != null) { #
    <div class="date-overlay #= getDueClassTile(data.DueStatus, data.Type) #">
        Due:
        # if (data.DueStatus == 'Warning' || data.DueStatus == 'Overdue') { #
            <i class="fa-icon-exclamation-triangle"></i>
        # } #
        #= data.Due #
    </div>
# } #

We're also formatting the dates inside the datasource, and using the same checks:

schema : {
    type: "json",
    data: "Courses",
    parse: function (data) {
        var courses = data.Courses;

        $.map(courses, function (item, index) {
            if (typeof(item.Due) !== "undefined" && item.Due != null) {
                item.Due = kendo.toString(kendo.parseDate(item.Due), "dd-MMM-yyyy");
            }

            if (typeof(item.CompletedDate) !== "undefined" && item.CompletedDate != null) {
                item.CompletedDate = kendo.toString(kendo.parseDate(item.CompletedDate), "dd-MMM-yyyy");
            }

            if (typeof(item.LastCompleted) !== "undefined" && item.LastCompleted != null) {
                item.LastCompleted = kendo.toString(kendo.parseDate(item.LastCompleted), "MMM dd");
            }

            if (typeof(item.SessionDate) !== "undefined" && item.SessionDate != null) {
                item.SessionDate = kendo.toString(kendo.parseDate(item.SessionDate), "dd-MMM-yyyy");
            }
        });

        return data;
    }
}

It looks like something about the undefined/null checks in the datasource and/or template are failing when the dates are in French (since the if statements never get executed), but I'm not sure what it could be.

[Ashleigh L]

Here's the working example: http://app.smarteru.com/custom/kendo/index.cfm

You can change the language/culture in the upper right corner (it does a console.log of the selected culture) and watch the overlays disappear from the images. There are no errors in the console.

[Rosen]

Hello shimmoril,

As you know the kendo.parseDate by default uses the current culture's date format. However, in your case the date are in different format when culture is set to french which causes the parsing to fail. Instead of relaying on the current culture format for parsing you should set input date format explicitly using the second parameter of the kendo.parseDate. For example:

item.Due = kendo.toString(kendo.parseDate(item.Due, "MM/dd/yyyy"), "dd-MMM-yyyy")

Regards,
Rosen
Telerik

 

 

[Ashleigh L]

We've got a ton of dates we're formatting, and it's pretty time-prohibitive to go through and modify all those references. Related to my other thread (http://www.telerik.com/forums/set-culture-for-only-specific-widget-%28scheduler%29), is there no way to exclude datasources from the culture functionality? And/or only enable the translation for the scheduler?

[Rosen]

Hello shimmoril,

 

I'm afraid that the culture settings can only be applied for the whole page, not for specific widgets. Also have in mind that you are manually parsing the dates and this is how the parseDate is designed to work. Note that if the original date strings are in an universal format such as ISO8601 Date format, it will not be required to pass the format as this format will be valid for all culture settings.

 

Regards,
Rosen
Telerik

 

 

[Ashleigh L]

Yeah, I understand how it's "supposed" to work, but the problem is that the SPA is one new shiny page in a system that's existed for 5 years and we don't want to break our date formatting standards on just one page. This is a proof-of-concept for slowly migrating the entire system and at that point we'll probably switch to fully localized dates etc, but it's not possible right now.

Thanks for the help.

[Rosen]

Hello shimmoril,

 

I'm afraid that the mentioned approaches (supplying the correct date format or using a universal date format) are currently the only way to approach the behavior you are experiencing.

 

Regards,
Rosen
Telerik