通过 AJAX（ASP.NET MVC）将 json 结果附加到 div答案

【问题标题】：Append json result to div via AJAX(ASP.NET MVC)通过 AJAX（ASP.NET MVC）将 json 结果附加到 div
【发布时间】：2017-04-04 08:24:01
【问题描述】：

我有一个有效的 AJAX 调用并返回 JSON

这里是 AJAX 调用

<script>
$('#display').click(function () {
    var vacancyId = $("#vacancy").val();
    var model = {
        vacancyId: vacancyId
};

    $.ajax({
        url: '@Url.Action("QuestionBlocks", "Questions")',
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(model),
        type: 'POST',
        dataType: 'json',
        processData: false,
        success: function (data) {
            $(".list").append('<div>' + data.Question1 + '</div>');

        }
    });
        });

这里是服务器端

  [HttpPost]
    public ActionResult QuestionBlocks(int vacancyId)
    {
        var items = db.QuestionBlocks
                      .Where(x => x.Interview.VacancyId == vacancyId)
                      .Select(x => new 
                      {
                          ID = x.Block_ID.ToString(),
                          Question1 = x.Question1,
                          Question2 = x.Question2,
                          Question3 = x.Question3,
                          Question4 = x.Question4,
                          Question5 = x.Question5,
                          Question6 = x.Question6,
                          Question7 = x.Question7,
                          Question8 = x.Question8,
                          Question9 = x.Question9,
                          Question10 = x.Question10,

                      })
                      .ToList();
        return Json(items, JsonRequestBehavior.AllowGet);
    }

它返回这样的数据

{ID: "1087", Question1: "Расскажите о себе", Question2: "说说你”，…}

我的问题 - $(".list").append('<div>' + data.Question1 + '</div>'); 运行良好，但它显示 undefined

为什么会这样？

【问题讨论】：

能否成功打印数据？请添加'console.log（数据）！在 !$(".list").append...' 之前。

标签： javascript jquery asp.net json ajax

【解决方案1】：

data 内部好像有一个数组，所以试试这样的成功代码：

$.ajax({
    url: '@Url.Action("QuestionBlocks", "Questions")',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(model),
    type: 'POST',
    dataType: 'json',
    processData: false,
    success: function (data) {
        var question1 = data[0];
        $(".list").append('<div>' + question1.Question1 + '</div>');

    }
});

【讨论】：

现在有这个Unexpected token o in JSON at position 1
尝试console.log(data) 并在此处发布您的回复。
Array[1] 0 : Object ID : "1087" Question1 : "Расскажите о себе" Question2 : "Tell about you" Question3 : "Tell about your family" Question4 : "Tell about your family" Question5 : "Tell about you" Question6 : "Lol" Question7 : "Tell about your family" Question8 : "Lol" Question9 : "Tell about your family" Question10 : "Вопрос" __proto__ : Object
好的，试试这个$(".list").append('<div>' + data[0].Question1 + '</div>');
还是得到这个Uncaught SyntaxError: Unexpected token o in JSON at position 1

【解决方案2】：

听起来您需要将数据解析为 JSON。尝试像这样使用它：

$(".list").append('<div>' + JSON.parse(data).Question1 + '</div>');

【讨论】：

Unexpected token o in JSON at position 1我现在有这个

【解决方案3】：

我认为它不会返回 {ID: "1087", Question1: "Расскажите о себе", Question2: "Tell about you",…}。你确定吗？ items 将是数组 (ToList())。

[{ID: "1087", Question1: "Расскажите о себе", Question2: "Tell about you",…}]

所以先来：

var question1 = data[0]
$(".list").append('<div>' + question1.Question1 + '</div>');

【讨论】：

如果我删除 var data = JSON.parse(data); 一切都很好。谢谢