CODEWITHSUNDEEP
javascriptc#asp.net-mvcmodel-view-controller
Jd Savage
Jd Savage

Reputation: 51

MVC convert json stored as a string

I have a model object 

model.ToDoList =  { "completed": false, "taskId": "in01", "memberName": "JD", "dueDate": "Mon Apr 25 16:09:18 EDT 2016" }, { "completed": false, "taskId": "in02", "memberName": "JD", "dueDate": "Mon Apr 25 16:09:18 EDT 2016" }, { "completed": false, "taskId": "in16", "memberName": "JD", "dueDate": "Wed Apr 20 16:09:18 EDT 2016" } ]

This is a json object stored as a string. How can I convert the string into an object in the view? I am trying to loop through that ojbect and display on the screen

@model Gallant.Models.Enrollment

<table class="table">
    <tr>
        <th>Completed</th>
        <th>Description</th>
        <th>Member</th>
        <th>Due Date</th>
        <th>Upload Document</th>
    </tr>
</table>
<div class="form-group">
    <div class="col-md-10">
        @Html.DisplayFor(model => Model.ToDoList)
    </div>
</div>

Upvotes: 0

Views: 770

Answers (3)

rishikesh tadaka
rishikesh tadaka

Reputation: 483

One of the way to display json is like below:

In your view, just use Newtonsoft.Json to deserialize json and iterate it.

@{
    var json= "{ 'completed': false, 'taskId': 'in01'}" ;
    Dictionary<string, string> jsonObject = Newtonsoft.Json.JsonConvert.DeserializeObject<Dictionary<string, string>>(json);
    foreach(var item in jsonObject){
        <div>
            <label>@item.Key : </label>
            <span>@item.Value</span>
        </div>

    }
 }

Upvotes: 1

Anatoly
Anatoly

Reputation: 76

First of all, you should read about NewtonJson and download it from her http://www.newtonsoft.com/json.

Secondly, you should create a class with all fields that you have in JSON. Like this

public class ListItem
{
    public bool Completed { get; set; }
    public string TaskId { get; set; }
}

Then in your Enrolment class you should do something like this

public class Enrolment
{
     public IEnumerable<ListItem> ToDoList{ get; private set; }

     public void ApplyJSON(string json)
     {
          //Magic :)
          YourList = JsonConvert.DeserializeObject<IEnumerable<ListItem>>(json);
     }
}

Finally, replace your line

model.ToDoList =  { "completed": false, "taskId": "in01",...}

with model.ApplyJson("{ "completed": false, "taskId": "in01",...}")

Thus, in the @Html.DisplayFor(model => Model.ToDoList) you'll have list of ListItem items and you can do everything you want.

Upvotes: 0

Travis Schettler
Travis Schettler

Reputation: 854

You can use Json.NET to deserialize this to either a class instance or an anonymous object. Here's how you would do it for an anonymous type, defining the properties you want deserialized:

var result = new[]{ new { Completed = false, TaskId = "", MemberName = "", DueDate = "" } };
result = JsonConvert.DeserializeAnonymousType(model.TodoList, result);

Or to your own custom class: 

var result = JsonConvert.DeserializeObject<List<MyClass>>(model.TodoList);

Seems like it would be better suited to do this parsing outside of the view though.

Upvotes: 0

Related Questions