Question

我在我的一个项目中使用Kendo UI图表今天注意到在不同的浏览器中有一个奇怪的行为，我在x轴上有日期，它是在不同时间区域的不同浏览器中自动转换日期。

与UTC + 5类似，显示的日期范围为2014年3月1日至2014年3月31日，而在UTC-6中显示的日期范围为2014年2月28日至2014年3月30日。

Answer 1

基本上这是由于客户端和服务器的时区之间的差异以及这些日期被转移并在双方重新创建到Date（JS）/ DateTime（.NET）对象中的形式。

基本上，详细解释了here整个情节。 Chart正在使用的dataSource与Grid使用的dataSource相同，因此没有区别。

以下是我可以使用的项目的一些示例代码。检查requestEnd处理程序

@(Html.Kendo().Grid<KendoMVCWrappers.Models.Person>().Name("persons")
            .DataSource(dataSource => dataSource

                .Ajax()
                .Events(ev => ev.RequestEnd("convert"))
                .Model(model => model.Id(m => m.PersonID))
                    .Read(read => read.Action("GetPersons", "Home"))
                    .Update(up => up.Action("UpdatePerson", "Home"))
            )
            .Filterable()
            .Columns(columns =>
            {
                columns.Bound(c => c.PersonID);
                columns.Bound(c => c.Name);
                columns.Bound(c => c.BirthDate);
                columns.Command(cmd => cmd.Edit());
            })
            .Pageable()
            .Sortable()
        )

<script type="text/javascript">
    function convert(e) {
        if (e.response.Data && e.response.Data.length) {
            var offsetMiliseconds = new Date().getTimezoneOffset() * 60000;
            var persons = e.response.Data;
            for (var i = 0; i < persons.length; i++) {
                persons[i].BirthDate = persons[i].BirthDate.replace(/\d+/,
                function (n) { return parseInt(n) + offsetMiliseconds }
            );
            }
        }
    }
</script>

ViewModel的setter代码。使用setter可以简化整个情况，因为您必须在多个位置执行此操作（在从数据库中提取对象以及从ModelBinder创建对象时创建对象之前）。

public class Person
{
    public int PersonID { get; set; }
    public string Name { get; set; }
    private DateTime birthDate;
    public DateTime BirthDate
    {
        get { return this.birthDate; }
        set
        {
            this.birthDate = new DateTime(value.Ticks, DateTimeKind.Utc);
        }

    }
}

祝你好运！

Answer 2

尝试解析onRequestEnd中此帖中提到的日期时出现空响应错误。 http://www.telerik.com/support/code-library/using-utc-time-on-both-client-and-server-sides

我通过解析数据源解析方法而不是requestEnd来解决这个问题。

parse :function(data)
            {
                return ConvertToUTC(data);
            }


 function ConvertToUTC(data)
        {

            // iterate over all the data elements replacing the Date with a version
            // that Kendo can work with.
            $.each(data, function(index, item){
                if(index == "data")
                {

                    for(i =0 ;i< item.length; i++)
                    {
                       // Days is my date property in item collection 
                        item[i].Days = item[i].Days.replace(/\d+/,
                     function (n) {
                         var time = parseInt(n);
                         return parseInt(time) + new Date(time).getTimezoneOffset() * 60000;
                     }
                 );

                    }
                }
            }); 

            return data;

        }

Kendo UI图表根据时区在不同浏览器中转换日期

2 个答案: