How to parse objects from ViewBag to JavaScript?

Question

I am trying to parse an object from ViewBag to Javascript without luck. I have tried so far with jQuery/razor/mixed syntax...to no avail. When I tried with Json.Encode(), I get an "error not defined".

Class

class Story 
{
    public long Id {get;set;}
    public string Description{get;set;}
}

Controller

[HttpGet]
public IActionResult Index(Story _story) 
{
    List<Location> Locations = this.context.Locations.ToList();
    ViewBag.story = _story;
    return View(context.Locations);
}

View

$(document).ready(function() {
        var story = JSON.parse("@ViewBag.story");
        var story2try = '@(ViewBag.story)';

        console.log(@ViewBag.story.Id);
        console.log(story);
        console.log(story2try);
});

The thing is the first log gets printed so for primitive data types such as strings/int/long it works but not for objects. I get this error afterwards:

Unexpected token A in JSON at position 0 SyntaxError: Unexpected token A in JSON at position 0

What does the rendered – as seen by the browser – view look like. — Richard, Dec 30 '17 at 09:42
`'@(ViewBag.story)'` will likely give you something like `Story` - ie the type.ToString(). Your controller is returning an *object* not JSON, so there's nothing parse. You should be able to just use `var story = {}; story.Description = '@ViewBag.story.Description'; story.Id = @ViewBag.story.Id;` — freedomn-m, Dec 30 '17 at 10:09
Did you try: `var story=JSON.parse("@((new System.Web.Script.Serialization.JavaScriptSerializer()).Serialize(ViewBag.Story))";` — freedomn-m, Dec 30 '17 at 10:11
@freedomn-m so basically i have to take property by property to get all the object? And no i didn't try System.Web.Script... — Bercovici Adrian, Dec 30 '17 at 10:14
No, that's just an example to show how to get to specific properties. If you want to *de*serialise something, you have to *serialise* it first (as per my 2nd comment). — freedomn-m, Dec 30 '17 at 12:18

Mikhail · Answer 1 · 2017-12-30T10:45:35.217

2

It is necessary to serialize the model object first (like it is suggested in comments) plus get its raw content (check the ASP.NET MVC using ViewData in javascript thread), for example:

ViewBag.story = new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(_story);

$(function () {
    var story = @Html.Raw(ViewBag.story);
    alert(story.Id);
});

edited Dec 30 '17 at 10:45

answered Dec 30 '17 at 10:35

Mikhail

9,186
4
33
49

Is this in .NET Core too? – Bercovici Adrian Dec 30 '17 at 11:45
@user1913744 for Core use [JSON.Net](https://www.nuget.org/packages/Newtonsoft.Json/10.0.3). (I would also use JSON.NET for Framework: it is faster and more flexible than any inbuilt JSON support.) – Richard Dec 30 '17 at 13:38
Where would you place that code? Is it posible to do this in the script block? – DanDan Nov 10 '18 at 00:29

score 2 · Accepted Answer · answered Dec 30 '17 at 14:41

So after countless tries i managed to solve the problem :

1.Serialize my object in the controller as others pointed out using the Newtonsoft.Json library:

ViewBag._story =JsonConvert.SerializeObject(_story);

2.In the view i would deserialize it using:

var _story=@(Html.Raw(ViewBag._story));

Thank you for your help !

How to parse objects from ViewBag to JavaScript?

2 Answers2

Linked