Parse JSON file in ASP.NET MVC and display the data in the webpage

Question

I have a remote URL from where I read a JSON Object that looks like this:

{"books":
 [
   {"title":"Book 1", "author":"Author1", "price":762, "inStock":15},
   {"title":"Book 2", "author":"Author2", "price":100, "inStock":1},
   {"title":"Book 3", "author":"Author3", "price":185.5, "inStock":5},
   {"title":"Book 4", "author":"Author 4", "price":1748, "inStock":3},
   {"title":"Book 5", "author":"Author 5", "price":999, "inStock":20},
   {"title":"Book 6", "author":"Author 6", "price":499.5, "inStock":3},
   {"title":"Book 7", "author":"Author 7", "price":564.5, "inStock":0}
 ]
}

I have created two classes Book.cs

public class Book
{
    public string title;

    public string author;

    public string price;

    public string inStock;
}

And Books.cs

public class Books
{
    public IList<Book> books { get; set; }
}

How to correctly parse the JSON so I can show the contents in the Razor HTML

This is my controller:

public ActionResult Index()
{
    var webClient = new WebClient();
    var json = webClient.DownloadString(@"http://www.myurl.json");
    Books[] books = JsonConvert.DeserializeObject<Books[]>(json);

    return View(books);
}

Answer 1

Your Books class already contains a collection property to represent each of your individual books, so you don't need to actually deserialize a Books[] but rather just a Books object :

// Since Books is already a container element, it will map the "books" property
// from your JSON object to the matching IList<Book> property
var books = JsonConvert.DeserializeObject<Books>(json);

Example

You can see a complete working example of this here and the example code demonstrated in the snippet below.

// YourClasses.cs
namespace Example
{
	public class Book
	{
		public string title;
	
		public string author;
	
		public string price;
	
		public string inStock;
	}
	
	public class Books
	{
		public IList<Book> books;
	}
}

// YourController.cs
namespace Example
{
	public class HomeController : Controller
	{
		[HttpGet]
		public ActionResult Index()
		{
			// Example JSON in lieu of API call
			var json = "{\"books\":[{\"title\":\"Book 1\", \"author\":\"Author1\", \"price\":762, \"inStock\":15},{\"title\":\"Book 2\", \"author\":\"Author2\", \"price\":100, \"inStock\":1},{\"title\":\"Book 3\", \"author\":\"Author3\", \"price\":185.5, \"inStock\":5},{\"title\":\"Book 4\", \"author\":\"Author 4\", \"price\":1748, \"inStock\":3},{\"title\":\"Book 5\", \"author\":\"Author 5\", \"price\":999, \"inStock\":20},{\"title\":\"Book 6\", \"author\":\"Author 6\", \"price\":499.5, \"inStock\":3},{\"title\":\"Book 7\", \"author\":\"Author 7\", \"price\":564.5, \"inStock\":0}]}";	
			var books = JsonConvert.DeserializeObject<Books>(json);
			return View(books);
		}
	}
}

// Index.cshtml
@model Example.Books
<ul>
    @foreach(var book in Model.books){
		<li>@book.title</li>
	}
</ul>