Search code examples
javascriptasp.netjsonasp.net-mvcasp.net-mvc-5

How to get JSON object from Razor Model object in javascript


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.


Solution

  • 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.