Convert .Net object to JSON object in the view

Question

I want to convert a .Net object in to JSON in the view. My view model is like this,

public class ViewModel{
    public SearchResult SearchResult { get; set;}    
}    

public class SearchResult {
    public int Id { get; set; }
    public string Text{ get; set; }
}

I want to convert Model.SearchResult in to a JSON object. Currenty I'm doing it like this:

System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
//....
var s = @serializer.Serialize(Model.Institution);

but the result is like this,

var s = { &quot;Name&quot;:&quot;a&quot;,&quot;Id&quot;:1};
Create:228Uncaught SyntaxError: Unexpected token &

How can I convert this correctly in to a JSON object?

refer stackoverflow.com/questions/3365551/…

Hemant Metalia
– Hemant Metalia

2011-12-14 09:36:28 +00:00
Commented Dec 14, 2011 at 9:36 — Hemant Metalia
– Hemant Metalia, Commented Dec 14, 2011 at 9:36

Kyeotic · Accepted Answer · 2011-12-15 00:35:37Z

65

Try using this method:

@Html.Raw(Json.Encode(Model.Content))

answered Dec 15, 2011 at 0:35

Kyeotic

19.9k12 gold badges73 silver badges133 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

D.Rosado Over a year ago

Is there any way to change the default Json.Encode serializer to JSON.NET?

Kyeotic Over a year ago

If you google .net default json serializer you will find a ton of links for doing exactly that.

Joshua Over a year ago

This is the best answer. Could only be more simple if the actual string was JSON to begin with :)

oscilatingcretin Over a year ago

For those wondering,Json.Encode is found in System.Web.Helpers.

Joel McBeth Over a year ago

@Tyrsius, Those results do not tell you how to change Json.Encode to use the JSON.NET serializer.

Community · Accepted Answer · 2017-05-23 12:02:46Z

I use this helper since asp.net mvc 2

public static MvcHtmlString ToJson(this HtmlHelper html, object obj)
{
  JavaScriptSerializer serializer = new JavaScriptSerializer();
  return MvcHtmlString.Create(serializer.Serialize(obj));
}

public static MvcHtmlString ToJson(this HtmlHelper html, object obj, int recursionDepth)
{
  JavaScriptSerializer serializer = new JavaScriptSerializer();
  serializer.RecursionLimit = recursionDepth;
  return MvcHtmlString.Create(serializer.Serialize(obj));
}

And in the view:

  <script>
    var s = @(Html.ToJson(Model.Content));
  </script>

I should replace serializer with the JSON.Encode(..) now, like mentionned in the refer by Hemant. (It use itself JavaScriptSerializer).

The source of your problem is the "@" which HTML encode the JSON. You can use @Html.Raw(..) to avoid this behavior.

+: take a look for Json.Net http://json.codeplex.com/

JSON.Net update

I've updated the helper a while ago with JSON.net (much better).

It seems some users continue to read, upvote and use the old code. I'd like they use a better way, with the new version below, or by using NGon like Matthew Nichols has noticed it in a comment.

Here's the code:

using System;
using Newtonsoft.Json;

namespace System.Web.Mvc
{
  public static class HtmlHelperExtensions
  {
    private static readonly JsonSerializerSettings settings;

    static HtmlHelperExtensions()
    {
      settings = new JsonSerializerSettings();
      // CamelCase: "MyProperty" will become "myProperty"
      settings.ContractResolver = new Newtonsoft.Json.Serialization.CamelCasePropertyNamesContractResolver();
    }

    public static MvcHtmlString ToJson(this HtmlHelper html, object value)
    {
      return MvcHtmlString.Create(JsonConvert.SerializeObject(value, Formatting.None, settings));
    }
  }
}

I typically set up NGon (github.com/brooklynDev/NGon) for this sort of thing but if I am just using in one spot this is a nice solution.

Clarence · Accepted Answer · 2016-09-30 20:58:24Z

1

This is an update to my original answer and I'll admit that as a result of the insistent badgering of @Tyrsius :D who refused to give up the fact that I could not access vars created in <script> tags in my MVC 5 cshtml page from my .js libraries in separate files, I discovered that if I placed the script tags inside of the @section scripts statement block that the vars created there did make the global scope and was available to my plugin widgets. I have not used it within any of my more complex apps as of yet, but did use it in a protoType of another app and the answer is below. Now @Html.Raw(...) works and I was able to serialize an object that I could immediately use.

This is something I will be using from now on... thanks again for hanging in there with me @Tyrsius

   @section scripts
    {
    <script type="text/javascript">
        @using MRTCProtoType.Models.ControllerData.Contracts

        var testVar = @Html.Raw(JsonConvert.SerializeObject(WMMWorkloadTestData.getWorkloadTestData()));
    </script>
        @Scripts.Render("~/bundles/homeworkflow")
    }

The following code is in a separate .js file

$(document).ready(function() {  
    alert(JSON.stringify(testVar));
});

edited Sep 30, 2016 at 20:58

answered Jul 16, 2016 at 22:59

Clarence

1011 silver badge9 bronze badges

2 Comments

Kyeotic Over a year ago

This is an interesting "gotcha" that I haven't run into before, thank you for including it =)

Clarence Over a year ago

Thanks for nudge... it made me do the work to find a much better solution... notice the slight of hand cred I gave u lol...

Collectives™ on Stack Overflow

Convert .Net object to JSON object in the view

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related