将Json从Controller传递给View

时间:2015-01-22 10:13:40

标签: json

我有一个电影数据库,我希望创建一个Json,然后在我的视图中访问该json。我已使用以下代码在控制器中成功创建了json:

   var movies = from m in db.Movies
                     select m;

   string jsonData = JsonConvert.SerializeObject(movies);

这会创建一个json,我已通过writeline传递给控制台,它会生成以下JSON:

[{"ID":1,"Title":"When Harry Met Sally","ReleaseDate":"1989-01-11T00:00:00","Genre":"Romantic Comedy","Price":7.99,"Rating":"PG","Review":79.90},
{"ID":2,"Title":"Ghostbusters ","ReleaseDate":"1984-03-13T00:00:00","Genre":"Comedy","Price":8.99,"Rating":"PG","Review":94.90},    
{"ID":3,"Title":"Ghostbusters 2","ReleaseDate":"1986-02-23T00:00:00","Genre":"Comedy","Price":9.99,"Rating":"15","Review":89.90},
{"ID":4,"Title":"Rio Bravo","ReleaseDate":"1959-04-15T00:00:00","Genre":"Western","Price":3.99,"Rating":"U","Review":91.90},
{"ID":5,"Title":"The Hangover","ReleaseDate":"2008-01-01T00:00:00","Genre":"Comedy","Price":9.99,"Rating":"18","Review":83.80}, 
{"ID":6,"Title":"Test","ReleaseDate":"2013-06-01T00:00:00","Genre":"Action","Price":10.00,"Rating":"18","Review":89.00}]

然后我想在我的视图中访问该json,并将其打印到我的视图中。我尝试了以下Ajax代码,但我似乎无法显示json数据。

<button id="test">Test</button>
<div class="inner"></div>

<script type="text/javascript">
  $(document).ready(function () {
    $('#test').on('click', function(){
      $.ajax({
        url: '@Url.Action("Index", "Movies")',
        dataType: 'json',
        context: document.body
    }).done(function(serverdata) {
        jsonData = serverdata;
        $.each(jsonData, function(i, item) {
           $(".inner").append("<p>" + jsonData + "</p>");
        });
    });
});
});
</script>

有什么想法吗?我做错了什么?

2 个答案:

答案 0 :(得分:1)

如果我们谈论ASP.NET MVC,那么你可以这样做:

行动代码:

[HttpGet]
public JsonResult Index(int? PageId)
{
    //other your code goes here
    var movies = from m in db.Movies
                 select m;
    return Json(new {result = movies}),JsonRequestBehavior.AllowGet);
}

客户代码:

$.ajax({
        type: "GET",
        url: '@Url.Action("Index", "Movies")',
        dataType: 'json',
        content: "application/json",
        cache : false
    }).done(function (serverdata) {
        if(result.result.length > 0)
        {
            $.each(result.result, function(i, item) {
                $(".inner").append("<p>" +"ID: "+ item.ID +", Title :" + item.Title+ "</p>");
            });
        }
        else
        {
            alert("No movies in result");
        }
    }).fail(function (jqXHR, textStatus) {
        alert("Internal server error." + "\n" + jqXHR.statusText );
    });

答案 1 :(得分:0)

尝试: -

<script type="text/javascript">
  $(document).ready(function () {
    $('#test').on('click', function(){
      $.ajax({
        url: '@Url.Action("Index", "Movies")',
        method: 'GET',
        dataType: 'json',
        context: document.body
        }).done(function(serverdata) {
        var jsonData = serverdata;
        $.each(jsonData, function(i, item) {
         $(".inner").append("<p>" +"ID: "+ item.ID +", Title :" + item.Title+ "</p>");
       });
    });
  });
});
</script>