109

In viewmodel object, below is the property:

  public IList<CollegeInformationDTO> CollegeInformationlist { get; set; }

In VIEW, javascript is as follow:

   var obj = JSON.stringify('@Model.CollegeInformationlist');
   alert(obj[1].State);  //NOT WORKING, giving string char

      $.each('@Model.CollegeInformationlist', function (i, item) {
    var obj = JSON.stringify(item);
    var r = $.parseJSON(obj);
    alert(r.State);    //just giving undefined.
    });

Please guide here, how i can get JSON object in javascript.

3
  • your javascript doesn't know what your CollegeInformationDTO class looks like. At my last job we defined an object in the script with the same structure as the model and then did a jquery .map to map the model to the javascript object. Also make sure what you are passing to the view is a JSON string Oct 13, 2014 at 15:58
  • You need to serialise your Model object to JSON. You should create a method (or property) that returns that result.
    – musefan
    Oct 13, 2014 at 16:00
  • Can you please share me some stuff to do this. here, i wrote var obj = JSON.stringify('@Model.CollegeInformationlist'); so, it should convert to JSON object and able to give result when explicitly write .State property but, its not working like a way. It looks, OBJECT is converted to string type.
    – dsi
    Oct 13, 2014 at 16:05

6 Answers 6

233

You could use the following:

var json = @Html.Raw(Json.Encode(@Model.CollegeInformationlist));

This would output the following (without seeing your model I've only included one field):

<script>
    var json = [{"State":"a state"}];   
</script>

Working Fiddle

AspNetCore

AspNetCore uses Json.Serialize intead of Json.Encode

var json = @Html.Raw(Json.Serialize(@Model.CollegeInformationlist));

MVC 5/6

You can use Newtonsoft for this:

    @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, 
Newtonsoft.Json.Formatting.Indented))

This gives you more control of the json formatting i.e. indenting as above, camelcasing etc.

11
  • 1
    I could not find JSON reference, getting an error as The name 'Json' does not exist in the current context If i add, Newtonsoft.Json. then, Encode not found.
    – dsi
    Oct 13, 2014 at 16:20
  • 21
    For anyone using AspNetCore, that uses Json.Serialize instead of Json.Encode.
    – TrueWill
    May 10, 2017 at 14:49
  • 6
    For newer versions of MVC 5/6 @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.Indented)) Jul 14, 2017 at 12:17
  • 1
    @R2D2 an added spin on your suggestion: JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.Indented, new JsonSerializerSettings { ContractResolver = new CamelCasePropertyNamesContractResolver() }) this also insures proper JavaScript CamelCase (or I should say camelCase) for the serialized JSON.
    – Al Dass
    Mar 13, 2018 at 2:46
  • 2
    @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.Indented)) worked for me
    – smj
    May 9, 2018 at 2:37
22

In ASP.NET Core the IJsonHelper.Serialize() returns IHtmlContent so you don't need to wrap it with a call to Html.Raw().

It should be as simple as:

<script>
  var json = @Json.Serialize(Model.CollegeInformationlist);
</script>
0
4

After use codevar json = @Html.Raw(Json.Encode(@Model.CollegeInformationlist));

You need use JSON.parse(JSON.stringify(json));

3
  • Small thing but you should format your code segment on the second line. It's too small of an edit so it won't let me do it.
    – Michael
    Apr 6, 2018 at 18:11
  • Why would you JSON.stringify and JSON.parse right one after another? It wouldn't be needed and would waste the resources.
    – Peter Ivan
    Nov 18, 2019 at 10:20
  • Make sense. I need test if work without JSON.stringify. I think that just JSON.parse(@Html.Raw(Json.Encode(@Model.CollegeInformationlist))) should work. Someone can test and let us know. But now I use that way and work to me. Nov 29, 2019 at 19:06
2

Pass the object from controller to view, convert it to markup without encoding, and parse it to json.

@model IEnumerable<CollegeInformationDTO>

@section Scripts{
    <script>
          var jsArray = JSON.parse('@Html.Raw(Json.Encode(@Model))');
    </script>
}
1
  • Why would you wrap the result in quotes and JSON.parse right one after another? It wouldn't be needed and would waste the resources.
    – Peter Ivan
    Nov 18, 2019 at 10:21
1

If You want make json object from yor model do like this :

  foreach (var item in Persons)
   {
    var jsonObj=["FirstName":"@item.FirstName"]
   }

Or Use Json.Net to make json from your model :

string json = JsonConvert.SerializeObject(person);
0
0

The following code worked for me

var chartD =  JSON.parse(JSON.stringify([@Json.Serialize(@Model)]));

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.