CODEWITHSUNDEEP
c#jsonmodel-view-controllerjson.netdeserialization
johnslippers
johnslippers

Reputation: 101

MVC Json to HTML table

I am trying to pass a serialized json string (serialized using JsonConvert.SerializeObject) into an html table. I would like to call values inside the json string into the table like this: "model.jsonvalue". I am not sure how to make variables out of the json string.

My Json string:

{
  "stats": {
    "global": {
      "cache": {
        "misses": "5"
      },
      "download": {
        "total-downloaded": "500"
      },
      "error": {
        "config-failed": "50",
        "retries": "20"
      },
      "instance": {
        "resets": "2016-06-23 09:45:07"
      },
      "servers": {
        "server-in-config": "1",
        "servers-running": "1",
        "servers-relays": "1"
      }
    },
    "servers": {
      "12345": {
        "uptime": "0d, 18:01:30",
        "retries": "0",
        "download-size": "54664",
        "server-restart": "1",
        "download-time": "1",
        "start-time": "2016-06-23 09:45:07",
        "logic-time": "123",
        "heartbeat": "1",
        "logic-retry": "0"
      },
      "44444": {
        "start-time": "2016-06-23 09:45:07",
        "download-time": "1",
        "logic-time": "123",
        "download-size": "54664",
        "server-restart": "1",
        "logic-retry": "0",
        "uptime": "0d, 18:01:30",
        "heartbeat": "1",
        "retries": "0"
      }
    }
  }
}

In my controller I serialized as follow:

string json = System.IO.File.ReadAllText(@path);
string jsonoutput = JsonConvert.SerializeObject(json);

...and I have a controller for the values I want to pass to the tables as follow:

public class Stats
{
    public Global global { get; set; }
    public List<server> servers { get; set; }
}

public class Global
{
    public Cache cache { get; set; }
    public Download download { get; set; }
    public Error error { get; set; }
    public Instance instance { get; set; }
    public servers servers { get; set; }
}

Now I know there is lots of articles explaining how to do this (I did google) but I do not want to use ajax, javascript, knockout or any scripts. Just plain MVC.

Hope somebody can assist as I am very new to MVC and json.

Upvotes: 0

Views: 1771

Answers (1)

pilak
pilak

Reputation: 39

If you want just plain ASP MVC then don't convert data from file to json. Load it to your statically typed model (Global class) and just pass it to view from controller, i.e.:

Controllers\DataController.cs:

public class DataController : Controller
{
    public ActionResult Index()
    {
        string data = System.IO.File.ReadAllText(@path);
        var model = ConvertDataToModelSomehow(data); //model variable type: Global 
        return View(model);
    }
}

Then you can make View and use your model - Views\Data\Index.cshtml:

@model Global //your model type passed to view

<table>
    <thead>
        <tr>
            <th>Server name</th>
        </tr>
    </thead>
    <tbody>
    @foreach(var item in Model.servers) //if Global.servers will be collection
    {
        <tr>
            <td>@item.Name</td> //if element has Name property
        </tr>
    }        
    </tbody>
</table>

More info here

Upvotes: 1

Related Questions