36

我正在做一个 MVC 应用程序，我需要将 json 对象从控制器传递到视图。

var dictionary = listLocation.ToDictionary(x => x.label, x => x.value);
return Json(new { values = listLocation}, JsonRequestBehavior.AllowGet);

我在控制器中使用的上述代码，现在当我部署视图页面时，它会在我的浏览器中打开一个下载对话框，当打开文件时，它会根据我需要的格式为我提供 json 对象。

现在我想返回我的视图页面也想访问视图页面中的 json 对象。我怎样才能做到这一点。

4

4 回答 4

60

当你这样做时，return Json(...)你明确告诉 MVC不要使用视图，并提供序列化的 JSON 数据。您的浏览器会打开一个下载对话框，因为它不知道如何处理这些数据。

如果你想返回一个视图，return View(...)就像你通常做的那样：

var dictionary = listLocation.ToDictionary(x => x.label, x => x.value);
return View(new { Values = listLocation });

然后在您的视图中，只需将您的数据编码为 JSON 并将其分配给 JavaScript 变量：

<script>
    var values = @Html.Raw(Json.Encode(Model.Values));
</script>

编辑

这是一个更完整的示例。因为我没有从你那里得到足够的上下文，所以这个示例将假定一个控制器Foo、一个动作Bar和一个视图模型FooBarModel。此外，位置列表是硬编码的：

控制器/FooController.cs

public class FooController : Controller
{
    public ActionResult Bar()
    {
        var locations = new[]
        {
            new SelectListItem { Value = "US", Text = "United States" },
            new SelectListItem { Value = "CA", Text = "Canada" },
            new SelectListItem { Value = "MX", Text = "Mexico" },
        };

        var model = new FooBarModel
        {
            Locations = locations,
        };

        return View(model);
    }
}

模型/FooBarModel.cs

public class FooBarModel
{
    public IEnumerable<SelectListItem> Locations { get; set; }
}

视图/Foo/Bar.cshtml

@model MyApp.Models.FooBarModel

<script>
    var locations = @Html.Raw(Json.Encode(Model.Locations));
</script>

从您的错误消息的外观来看，您似乎在混合不兼容的类型（即Ported_LI.Models.Locatio‌​n和MyApp.Models.Location），因此，回顾一下，确保从控制器操作端发送的类型与从视图接收到的类型相匹配。特别是对于这个示例，new FooBarModel在控制器中匹配@model MyApp.Models.FooBarModel视图。

于 2013-03-04T08:50:48.010 回答
5

您可以使用 AJAX 调用此控制器操作。例如，如果您使用 jQuery，您可能会使用以下$.ajax()方法：

<script type="text/javascript">
    $.ajax({
        url: '@Url.Action("NameOfYourAction")',
        type: 'GET',
        cache: false,
        success: function(result) {
            // you could use the result.values dictionary here
        }
    });
</script>
于 2013-03-04T07:29:16.563 回答
0 
<script type="text/javascript">
jQuery(function () {
    var container = jQuery("\#content");
    jQuery(container)
     .kendoGrid({
         selectable: "single row",
         dataSource: new kendo.data.DataSource({
             transport: {
                 read: {
                     url: "@Url.Action("GetMsgDetails", "OutMessage")" + "?msgId=" + msgId,
                     dataType: "json",
                 },
             },
             batch: true,
         }),
         editable: "popup",
         columns: [
            { field: "Id", title: "Id", width: 250, hidden: true },
            { field: "Data", title: "Message Body", width: 100 },
           { field: "mobile", title: "Mobile Number", width: 100 },
         ]
     });
});

于 2015-09-17T02:36:55.087 回答
-2 
$.ajax({
    dataType: "json",
    type: "POST",
    url: "/Home/AutocompleteID",
    data: data,
    success: function (data) {
        $('#search').html('');
        $('#search').append(data[0].Scheme_Code);
        $('#search').append(data[0].Scheme_Name);
    }
});
于 2014-03-28T06:50:03.680 回答