Kendo datepicker acting weired for different computers on two different timezone

问题

Hi we use a simple kendo datepicker for our web application.

$("#DateInput").kendoDatePicker({
        format: "dd/MM/yyyy",        
        culture: "en-GB",
        max: new Date()
    });

Now when we try to get the datepicker value in Javascript my browser gives me date format dd/MM/yyyy but my colleague's browser gives him MM/dd/yyyy. We have tried to use same culture as you can see in kendo and as well as in our web.config we have put the globalization settings as follows.

<system.web>
    <globalization uiCulture="en-GB" culture="en-GB" />
</system.web>

My computer's date format and settings are as follows;

Region & Language format: English(United Kinddom)
Keyboard Layout: English(United Kingdom)
Long and Short Date format: dd MMMM yyyy
Timezone: GMT+6

My colleague's date format and settings are;

Region & Language format: English(Australia)
Keyboard Layout: English(Australia)
Long and Short Date format: dd MMMM yyyy
Timezone: GMT+8

Last bit of information, we are using Chrome for testing on both places. It is probably the UTC problem. I want the date format in "dd/MM/yyyy" for both occasion. Any workable solution will be highly appreciated. Thanks.

回答1:

Try to add this code at top of your page before you gonna render any kendo widget:

kendo.culture("en-GB");

It should forced kendo widgets to work in all location using en-GB culture.

If you're using ASP.MVC I recommend add it in "_Layout.cshtml" like:

<head>
...

    <script src="@Url.Content("~/Scripts/jquery/jquery-1.8.2.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Kendo/js/kendo.all.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Kendo/js/kendo.aspnetmvc.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Kendo/js/cultures/kendo.culture.pl-PL.min.js")"></script>
    <script src="@Url.Content("~/Kendo/js/cultures/kendo.culture.en-GB.min.js")"></script>
    <script src="@Url.Content("~/Kendo/js/cultures/kendo.culture.de-DE.min.js")"></script>

    <script type="text/javascript">
        kendo.culture("en-GB");
    </script>

    //widgets create scripts for your views if you write it here
</head>

Detail on globalization can be found on this link:

http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/globalization

回答2:

If your intention is to convert the date into your desired format "dd/MM/yyyy" and if your kendo grid is not providing you the correct result in different places, create your own. Some thing like this.

In Json:

var FixedDateFormat = "PlodDate: '" + (Date.getUTCDate() + 1) + "/" + (Date.getUTCMonth() + 1) + "/" + Date.getUTCFullYear() + " 00:00:00";

Here I have added 1 on Date and Month cause getUTCDate/Month starts from 0. As you have said in comments you are accepting the date as string and then converting that back to DateTime so I've added the time " 00:00:00".

In MVC: You probably need to do something like following to convert;

DateTime X = Convert.ToDateTime(PlodDate);

UPDATE

I've got a better solution for you on JS. You are reading datepicker value with something like this, right??

$("#YourDatePickerName").data("kendoDatePicker").value()

Here you can tell your browser what local you want to use like the following

$("#YourDatePickerName").data("kendoDatePicker").value().toLocaleString("en-GB");

Which will generate exact same result for every culture.

Further Update

If you want to do it Kendo's way then you can use kendo.toString(). You can check it here.

来源：https://stackoverflow.com/questions/21253430/kendo-datepicker-acting-weired-for-different-computers-on-two-different-timezone

标签

date

datetime

kendo-ui

kendo-asp.net-mvc

kendo-datepicker