Ajax 函数未显示 JSON 日期列表 (Mvc5)

Posted

技术标签:

【中文标题】Ajax 函数未显示 JSON 日期列表 (Mvc5)【英文标题】:Ajax function not showing JSON List of Dates (Mvc5) 【发布时间】:2017-09-10 10:38:34 【问题描述】:

在我的 MVC5 视图中,我正在调用 JSON 函数。 JSON 函数返回一个 AvaliableDates 模型,其中定义了一个 Userld(string) 和一个 DateTime 对象列表。

我的视图只能读取 Userld 但 DateTime-objects 显示为“未定义” 谁能看到为什么我没有在我的视图中获得 JSON DateTime LIST 值?

我的 JSON 函数:

public JsonResult GetFreeAppointmentDays()

 List<DateTime> avaliableBookingDays = new List<DateTime>();

 DateTime x1 = new DateTime(2017, 04, 11, 0, 0, 0);
 DateTime x2 = new DateTime(2017, 04, 12, 0, 0, 0);

 avaliableBookingDays.Add(x1.Date);
 avaliableBookingDays.Add(x2.Date);

 useravaliableDates AvaliableDates = new useravaliableDates()
 
    UserIDs = "4,5,2,0,0,0,2",
    Avdata = avaliableBookingDays    
 ;

 return Json(AvaliableDates, JsonRequestBehavior.AllowGet);

这是我的视图,使用 AJAX 调用:

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <input type="text" id="txtName" />
    <input type="button" id="btnGet" value="Get Current Time" />
    <div id="divshow"/>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () 
            $("#btnGet").click(function () 
                $.ajax(
                    type: "POST",
                    url: "/Home/GetFreeAppointmentDays",
                    dataType: "json",
                    success: function (data) 

                        $('#divshow').append(data);
                        var items = '';
                        $.each(data.Avdata, function (i, item) 
                            var row = "UserIDs are: " + data.UserIDs + "  Date " + i + " -> " + item[i].Date + "<br/>"

                            $('#divshow').append(row);
                        );
                    ,
                    failure: function (response) 
                        alert(response.responseText);
                    ,
                    error: function (response) 
                        alert(response.responseText);
                    
                );
            );
        );
    </script>
</body>
</html>

奇怪:我的 JSON 函数返回这个

"UserIDs":"4,5,2,0,0,0,2","Avdata":["\/Date(1491861600000)\/","\/Date(1491948000000)\/","\/Date(1492034400000)\/","\/Date(1492207200000)\/","\/Date(1492466400000)\/"]

【问题讨论】:

它对你有用吗?我更新了我的答案。 【参考方案1】:

您正在获取毫秒格式的日期。 将 C# 日期对象转换为字符串格式并将Avdata 属性更改为List&lt;String&gt;

avaliableBookingDays.Add(x1.ToString("yyyy-MM-ddTHH:mm:ss"));
avaliableBookingDays.Add(x2.ToString("yyyy-MM-ddTHH:mm:ss"));

然后将其转换为 javascript 日期对象:

var row = "UserIDs are: " + data.UserIDs + "  Date " + i + " -> " + new Date(item); + "<br/>" 

【讨论】:

【参考方案2】:

您需要一个function,它将像\/Date(1491861600000)\/ 这样的日期转换为真实日期。为此,您可以使用replace 方法。

function parseDate(value)
   var newDate=new Date(parseInt(value.replace("/Date(", "").replace(")/",""), 10));
   return newDate.getDate()+'/'(newDate.getMonth()+1)+'/'+newDate.getFullYear()

在您的 each 方法中使用我在上面创建的 parseDate 函数:

$.each(data.Avdata, function (i, item) 
    var row = "UserIDs are: " + data.UserIDs + "  Date " + i + " -> " + parseDate(item)+ "<br/>"
    $('#divshow').append(row);
);

【讨论】:

以上是关于Ajax 函数未显示 JSON 日期列表 (Mvc5)的主要内容,如果未能解决你的问题,请参考以下文章

mvc从前台发送ajax请求得到的数据显示未定义(undefined),哪位帮忙看看

在 asp.net mvc 中使用 ajax 显示复杂的 JSON 数据

使用 JSON 结果填充下拉列表 - 使用 MVC3、JQuery、Ajax、JSON 的级联下拉

JSON 构造函数显示为未定义

Ajax/Json MVC 表填充不起作用

AJAX 回调未显示成功消息 - ASP.NET MVC C#