Registering globalize.js before kendo culture js causes datetime columns in grids to fail formatting

[Richard]

Ok I'm using globalize.js and registering it BEFORE the kendo culture javascript, and using my helper to pick the right culture file.
In my case it is en-GB.

However, if I bind a DateTime column on my model in a KendoUI grid, it fails to display anything at all.

I have tried various ways as shown here.

columns.Bound(o => o.AuthorityDate);
columns.Bound(o => o.AuthorityDate).Format("{0:d}");
columns.Bound(o => o.AuthorityDate).Title("AuthorityDate").Format("{0:dd/MM/yyyy hh:mm:tt}");

If I switch things and register globalize.js AFTER the kendo javascript, it then binds successfully.

So, I understand that registering globalize.js BEFORE should make kendo use globalize as per the help documentation.

So why is this NOT working?  I am using MVC5.1 kendo build 2014.1.318

<script src="@Url.Content("~/Scripts/globalize/globalize.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/globalize/cultures/globalize.culture." Core.Helpers.CultureHelper.GetCurrentCulture() + ".js")" type="text/javascript"></script>

<script src="https://da7xgjtj801h2.cloudfront.net/2014.1.318/js/kendo.all.min.js"></script>
<script src="https://da7xgjtj801h2.cloudfront.net/2014.1.318/js/kendo.aspnetmvc.min.js"></script>

<script src="@Url.Content("https://da7xgjtj801h2.cloudfront.net/2014.1.318/js/cultures/kendo.culture." + Core.Helpers.CultureHelper.GetCurrentCulture() + ".min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>

[Richard]

PS.

This is happening just in Grids.  Other controls like DatePicker are working fine.

[Richard]

P.P.S

Yes this is an Ajax call to fetch the data.

[Petur Subev]

Hello Richard,

Basically when you load the globalize library, kendo.parseDate starts using Globalize.parseDate method instead of our own implementation of kendo.parseNumber. And since the globalize parser is not able to parse the format that the MVC returns the date successfully.

e.g.

Globalize.parseDate("/Date(-47876400000)/")

Loading the globalize library after the Kendo scripts wont override our implementation and the Grid will parse it successfully.

I am afraid there is no other work-around to this case. 

Regards,
Petur Subev
Telerik

 

 

[Richard]

Thanks Petur.

Ok based on what kendo does then I can see the Globalize.parseDate needs some enhancing.
I've tried modifying Globalize.js parseDate method so it handles the value coming in as "/Date(<some number>)".

For those out there that want to keep using Globalize.js, I added this "hack" to the parseDate function at the end.

.....

if (date == null) {
     /* might be /Date(number) format, so try and return a date to give 
      UI code a chance to format with something like moment.js */
      var xDate = new Date(parseInt(value.replace("/Date(", "").replace(")", ""), 10));       
       return xDate || null;
   }  
return date || null;
};

Then in the grid I use moment.js to help with the formatting.

columns.Bound(o => o.AuthorityDate)
      .Width(150).ClientTemplate("#= moment(AuthorityDate).format('LLLL') #");

Regards,
Richard.