将事件数据传递给从Web API接收为JSON的jQuery周日历 [英] Passing Events Data to jQuery week calender received from Web API as JSON

问题描述

我正在使用 jQuery Week calender ，Asp.net Web API作为服务器端， Sql server作为后端。

I am using jQuery Week Calender, Asp.net Web API as server side and Sql server as backend.

根据演示，我所做的所有工作，但演示有静态JSON数据，这里我需要检索数据从服务器。

几乎所有其他的东西都清楚，工作正常，但是来自服务器的loadin事件数据有问题，并传递给日历，这是我从服务器得到的回复。

Almost all other thing are clear and working fine, but there is an problem with loadin events data from the server and passing to the calender, here is response I got from server.

[{"id":13,"title":"Event Name","body":"Content","start":"2012-10-16T03:30:00.00","end":"2012-10-16T06:30:00.00","typeEvnt":1},{"id":14,"title":"dfgfdg","body":"gdfgdfg","start":"2012-10-15T04:15:00.00","end":"2012-10-15T06:45:00.00","typeEvnt":1}]

日期时间为GMT格式，需要转换为当地时区，然后在日历中添加。

The Date Time is in GMT format, which needed to converted into local time zone, then to add in calender.

这是我正在做的广告对于日历：

Here is what I am doing to add it to Calender:

$.ajax({
                url: '/api/api/event/load',
                type: 'get',
                statusCode: {
                    200: function (data) {
                        var dataString = JSON.stringify( data);   

                        callback( {events : dataString} );
});

但是我在chrome中出现错误说明未捕获TypeError：无法调用方法'getTime'未定义我确定这涉及到日期转换。

But I got an error in chrome says Uncaught TypeError: Cannot call method 'getTime' of undefined I am quite sure this relates to Date conversion.

此错误后，日历不会加载事件。

After this Error the Calender Doesn't load events.

以下是几点，这些不清楚：

Here are few point, which are not clear in mind:

1. DateTime服务器应将数据发送到浏览器。


2. 如何将其转换为本地时区并传递到日历。


3. C＃.net中的服务器端代码用于形成所有格式的日期时间。

我需要从服务器检索DateTime数据的方法，并将其转换为本地时区，然后添加到jQuery Week Calender。

Over all I need the method to Retrieved DateTime Data from server and Convert it to the local time zone and then add it to jQuery Week Calender.

任何建议或线索都将是有用的或MVC演示。

推荐答案

首先，您在 $。ajax 呼叫中缺少一些方括号e。

Firstly, You are missing some close brackets in the $.ajax call above.

另请注意，使用成功更为常见：设置而不是 statusCode ：{200： ...等等。

Also note that it is more common to use the success: setting rather than statusCode: { 200:...etc.

查看JQuery Week Calendar网站上的演示，它期望JavaScript Date对象在每个事件中的开始和结束字段。
JSON不会自动将这些字段转换为Date，因此您需要所谓的reviver函数。
您还希望以文本格式返回文本，以便您可以使用JSON解析而不是JQuery的JSON解析器进行解析。

Looking at the demo on the JQuery Week Calendar site, it expects JavaScript Date objects for the start and end fields in each event. JSON will not automatically convert these fields into a Date, so you need what is called a reviver function to do so. You also want the text to come back in text format so that you can parse it using JSON parse rather than JQuery's JSON parser.

dateReviver 函数下面以ISO 8601日期格式解析日期，这是您正在寻找的信息。摘自：感谢：如何使用Windows 8将JSON文本反序列化为日期类型JSON.parse？：

The dateReviver function below parses dates in ISO 8601 date format, which is what you are looking for I believe. Taken from: Courtesy of: How to deserialize JSON text into a date type using Windows 8 JSON.parse? :

function dateReviver(value) {
  if (typeof value === 'string') {
    var re = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)$/
    var result = re.exec(value);
    if (result) {
        return new Date(Date.UTC(+result[1], +result[2] - 1, +result[3], +result[4],+result[5], +result[6]));
    }
  }
  return value;
}

而ajax函数调用JSON解析，后者又使用dateReviver函数转换那里的任何日期字符串。

And the ajax function calls JSON parse which in turn uses the dateReviver function to convert any date strings in there.

$.ajax({
  url: '/api/api/event/load',
  type: 'get',
  dataType: text,
  success: function(data) {
      var eventArray = JSON.parse(data, dateReviver);
      callback({events: eventArray});
  }
});

这篇关于将事件数据传递给从Web API接收为JSON的jQuery周日历的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！