如何通过JSON以指定的格式返回日期？

Question

如果你进入你的SO配置文件并点击'days visited'，你会看到一个方便的jQuery日期选择器，在你访问该网站的那些日子里，可以看到一个甜美的绿色。我正在尝试一些类似的东西，并从挑选SO的实施开始。我被困在搞清楚他们如何能够格式化并返回他们使用的特定JSON格式的访问日期。这里是我的副本（你可以通过检查页面的来源找到类似的东西）：

var visited = {2009：{5：{28：1,29：1}，6：{3：1,4 ：1,5：1,7：1,8：1,9：1,10：1,11：1,12：1,13：1,14：1,15：1,16：1,17：1 ，19：1,20：1,21：1,22：1,23：1,24：1,25：1,27：1,29：1,30：1}，7：{1：1,2 ：1,3：1,4：1,5：1,6：1,7：1,8：1,9：1,10：1,11：1,12：1,13：1,14：1 ，15：1,16：1,18：1,20：1,21：1,22：1,23：1,24：1,26：1,27：1,28：1,29：1,30 ：1,31：1}，8：{2：1,3：1,4：1,5：1,6：1,7：1,11：1,12：1,13：1,17：1 ，20：1,24：1,25：1,27：1,28：1}，9：{9：1,10：1,15：1,23：1,24：1}，10：{1 ：1,5：1,7：1,8：1,9：1,12：1,13：1,20：1,21：1,22：1,27：1,28：1,30：1 }，11：{5：1,9：1,10：1,16：1,17：1,24：1,25：1,26：1,30：1}，12：{2：1,7 ：1,8：1,9：1,11：1,12：1,13：1,14：1,15：1,16：1,17：1,18：1,21：1,22：1 ，23：1,28：1,30：1}}，2010：{1：{5：1,8：1,11：1,12：1,13：1,14：1,15：1,18 ：1,19：1,20：1,21：1,26：1,27：1,28：1}，2：{3：1,10：1,17：1,22：1,23：1 ，26：1}，3：{1：1,2：1,3：1,5：1,8：1}，4：{8：1,9：1,13：1,19：1,20 ：1,21：1,22：1,26：1,28：1,29：1}，5：{3：1,4：1,5：1,6：1 ，7：1,11：1,12：1,17：1,28：1}，6：{2：1,4：1,7：1,8：1,9：1,10：1,14 ：1,15：1,16：1,17：1,18：1,21：1,23：1,25：1}，7：{7：1,8：1,9：1,12：1 ，21：1,22：1,23：1,28：1,29：1}，8：{2：1,3：1,4：1,5：1,9：1,10：1,11 ：1,16：1,17：1,18：1,19：1,20：1,25：1,26：1,29：1,30：1,31：1}，9：{1：1 ，8：1}，10：{6：1,11：1,15：1,21：1,26：1,27：1,28：1}，11：{3：1,4：1,8 ：1,11：1,15：1,16：1,17：1,19：1,20：1,21：1,23：1,30：1}，12：{1：1,2：1 ，13：1,14：1,15：1,16：1,17：1,20：1,22：1,23：1,28：1}}，2011：{1：{3：1,5 ：1,6：1,7：1,12：1,14：1,18：1,20：1,21：1,25：1,26：1,27：1,28：1,31：1 }，2：{1：1,2：1,3：1,6：1,7：1,8：1,9：1,10：1,11：1}}};

它基本上是一个数组：[年] [月] [日]。我无法以这种格式发回数据，并想知道是否有人（可能是SO员工之一）有任何见解。

希望没有人认为我正在剥离这个问题。我真的很好奇他们是如何做到的。

编辑：为了澄清，我问的是什么控制器动作可能看起来像是如果我有一个.NET DateTime对象的掌握，并希望以所述格式返回JSON。

我的测试控制器方法是这样的：

[HttpPost] 
public JsonResult GetDates(int id) 
{ 
    var model = BaseRepository.FindById(id); 
    testDates = new DateTime[] { DateTime.Today, DateTime.Today.AddDays(1) }; 
    return Json(testDates); 
} 

当我通过AJAX调用它：

$.ajax({ 
    type: 'POST', 
    url: '<%= Url.Action("ClosedDates", "Venue", new { id = Model.Id }) %>', 
    dataType: 'json', 
    success: function (data) { alert(data); } 
}); 

警报显示我的日期预期的名单，但在.NET中的日期格式。我不确定是否应该在控制器中或在客户端回调数据。

EDIT 2

好了，也许使用该数组将有助于使更多的这种意义。再次，riffing关闭SO的实现（注意beforeShowDay功能如何分析当前日期的阵列被评估）：

var visited = { 2009: { 5: { 28: 1, 29: 1 }, 6: { 3: 1, 4: 1, 5: 1, 7: 1, 8: 1, 9: 1, 10: 1, 11: 1, 12: 1, 13: 1, 14: 1, 15: 1, 16: 1, 17: 1, 19: 1, 20: 1, 21: 1, 22: 1, 23: 1, 24: 1, 25: 1, 27: 1, 29: 1, 30: 1 }, 7: { 1: 1, 2: 1, 3: 1, 4: 1, 5: 1, 6: 1, 7: 1, 8: 1, 9: 1, 10: 1, 11: 1, 12: 1, 13: 1, 14: 1, 15: 1, 16: 1, 18: 1, 20: 1, 21: 1, 22: 1, 23: 1, 24: 1, 26: 1, 27: 1, 28: 1, 29: 1, 30: 1, 31: 1 }, 8: { 2: 1, 3: 1, 4: 1, 5: 1, 6: 1, 7: 1, 11: 1, 12: 1, 13: 1, 17: 1, 20: 1, 24: 1, 25: 1, 27: 1, 28: 1 }, 9: { 9: 1, 10: 1, 15: 1, 23: 1, 24: 1 }, 10: { 1: 1, 5: 1, 7: 1, 8: 1, 9: 1, 12: 1, 13: 1, 20: 1, 21: 1, 22: 1, 27: 1, 28: 1, 30: 1 }, 11: { 5: 1, 9: 1, 10: 1, 16: 1, 17: 1, 24: 1, 25: 1, 26: 1, 30: 1 }, 12: { 2: 1, 7: 1, 8: 1, 9: 1, 11: 1, 12: 1, 13: 1, 14: 1, 15: 1, 16: 1, 17: 1, 18: 1, 21: 1, 22: 1, 23: 1, 28: 1, 30: 1} }, 2010: { 1: { 5: 1, 8: 1, 11: 1, 12: 1, 13: 1, 14: 1, 15: 1, 18: 1, 19: 1, 20: 1, 21: 1, 26: 1, 27: 1, 28: 1 }, 2: { 3: 1, 10: 1, 17: 1, 22: 1, 23: 1, 26: 1 }, 3: { 1: 1, 2: 1, 3: 1, 5: 1, 8: 1 }, 4: { 8: 1, 9: 1, 13: 1, 19: 1, 20: 1, 21: 1, 22: 1, 26: 1, 28: 1, 29: 1 }, 5: { 3: 1, 4: 1, 5: 1, 6: 1, 7: 1, 11: 1, 12: 1, 17: 1, 28: 1 }, 6: { 2: 1, 4: 1, 7: 1, 8: 1, 9: 1, 10: 1, 14: 1, 15: 1, 16: 1, 17: 1, 18: 1, 21: 1, 23: 1, 25: 1 }, 7: { 7: 1, 8: 1, 9: 1, 12: 1, 21: 1, 22: 1, 23: 1, 28: 1, 29: 1 }, 8: { 2: 1, 3: 1, 4: 1, 5: 1, 9: 1, 10: 1, 11: 1, 16: 1, 17: 1, 18: 1, 19: 1, 20: 1, 25: 1, 26: 1, 29: 1, 30: 1, 31: 1 }, 9: { 1: 1, 8: 1 }, 10: { 6: 1, 11: 1, 15: 1, 21: 1, 26: 1, 27: 1, 28: 1 }, 11: { 3: 1, 4: 1, 8: 1, 11: 1, 15: 1, 16: 1, 17: 1, 19: 1, 20: 1, 21: 1, 23: 1, 30: 1 }, 12: { 1: 1, 2: 1, 13: 1, 14: 1, 15: 1, 16: 1, 17: 1, 20: 1, 22: 1, 23: 1, 28: 1} }, 2011: { 1: { 3: 1, 5: 1, 6: 1, 7: 1, 12: 1, 14: 1, 18: 1, 20: 1, 21: 1, 25: 1, 26: 1, 27: 1, 28: 1, 31: 1 }, 2: { 1: 1, 2: 1, 3: 1, 6: 1, 7: 1, 8: 1, 9: 1, 10: 1, 11: 1}} }; 
     $('#calendar').datepicker({ 
      beforeShowDay: function (date) { 
       var y = date.getFullYear(); 
       var m = date.getMonth() + 1; 
       var d = date.getDate(); 
       var hasVisited = visited[y] && visited[y][m] && visited[y][m][d]; 
       return [false, (hasVisited ? 'ui-state-active' : ''), (y + '-' + m + '-' + d)]; 
      } 
     }); 

Answer 1

当您在JSON发送日期时间，它被解析的格式如下：

\/Date(1297250340000)\/ 

你可以用这个代码解析您的日期时间在javascript：

var date = eval('new' + oData.replace(/\//g, ' ')); 

其中的OData是你的JSON控制器返回的日期。

希望它有帮助

Answer 2

我会创建一个模型来迎合该调用。您将在客户端进行更多的处理，但它会更多OO，并且您可以使用JS点符号来访问每个对象级别。

Ajax调用（我用的剃须刀，但你想通过ID作为一个数据元素）：

$.ajax({ 
    type: 'POST', 
    url: '@Url.Action("ClosedDates", "Venue")', 
    data: {id: 1}, 
    dataType: 'json', 
    success: function (data) { console.log({data: data}); } 
}); 

型号：

public class DateListModel 
{ 
    public int Month { get; set; } 
    public List<string> Days { get; set; } 
} 

    public class DateModel 
{ 
    public int Year { get; set; } 
    public List<DateListModel> DateList { get; set; } 
} 

控制器（测试数据）：

[HttpPost] 
public JsonResult ClosedDates(int id) 
{ 
     var dateList2009 = new List<DateListModel> { 
      new DateListModel{Month =5, Days = new List<string>{"28", "29"}}, 
      new DateListModel{Month = 6, Days = new List<string>{"3", "49", "5"}}, 
     }; 
     var dateList2010 = new List<DateListModel>{ 
      new DateListModel{Month = new DateTime(2010,1,1).Month, Days = new List<string>{"5", "8", "11"}}, 
      new DateListModel{Month = new DateTime(2010,2,1).Month, Days = new List<string>{"3", "10", "11"}}, 
     }; 

     var data = new List<DateModel>{ 
      new DateModel{ Year = 2009, DateList = dateList2009}, 
      new DateModel{ Year = 2010, DateList = dateList2010} 
     }; 
     return Json(data); 
    } 

Answer 3

根据我的经验，如果您不需要像处理Date数据类型那样处理客户端上的日期，那么将它发送到客户端会更容易作为一个字符串。

因此 - 将您的日期数组转换为DateTime数组作为字符串格式，然后将它们作为json发送给客户端。

Answer 4

所以，我用@alexl表示eval方法，并用以下（我会改进的余地，因为这感觉很肮脏）想出了：

$(document).ready(function() { 
$.ajax({ 
    type: 'POST', 
    url: 'myurl', 
    data: {id: 1}, 
    dataType: 'json', 
    success: function (data) { 
     var dates = new Array(); 
     // eval each of the dates coming from the server 
     for(var i = 0; i < data.length; i++) { 
      dates[i] = eval('new' + data[i].replace(/\//g, ' ')); 
     } 
     $('#calendar').datepicker({ 
      beforeShowDay: function (date) { 
       var isBooked = false; 
       // look for the current datepicker date in the array 
       for(var i = 0; i < dates.length; i++) { 
        if (dates[i].valueOf() == date.valueOf()) 
        { 
         isBooked = true; 
         break; 
        } 
       } 
       return [false, (isBooked ? 'ui-state-active' : ''), (date.valueOf)]; 
      } 
     }); 
    } 
}); 

}）;