JSON Data Tutorials

Tutorial Home › JSON Data

Go backwards - find Books pointing to Authors with Parents(...)

#1 Introduction to JSON

Get DataSources in Code - Introduction

Requirements

2sxc 10.20

Resources

Asdynamic JSON

Working with JSON Data

JSON data can be tricky. The easiest way is to convert it to a dynamic object using AsDynamic(string). Then you can easily use it in your code.

Show properties and sub-properties - case insensitive

Output

Title: This is a JSON title
Description: True
Sub-item title: sub-item title
Is this a list/array? False
Are the tags a list? True

@{
    var someJson = System.IO.File.ReadAllText(App.PhysicalPath + "/json/demo.json");
    var thing = AsDynamic(someJson);
  }
<ul>
  <li>Title: @thing.Title</li>
  <li>Description: @thing.IsCool</li>
  <li>Sub-item title: @thing.SubItem.Title</li>
  <li>Is this a list/array? @thing.IsList </li>
  <li>Are the tags a list? @thing.Tags.IsList </li>
</ul>

Source Code of demo.json{
    "title": "This is a JSON title",
    "isCool": true,
    "subItem": {
        "title": "sub-item title"
    },
    "tags": [
        "some tag",
        "another tag",
        "a third tag"
    ]
}

Loop through a list of 3 tags

Output

some tag
another tag
a third tag

<ol>
@foreach (var tag in thing.Tags) {
  <li>@tag</li>
}
</ol>

Source Code of demo.json{
    "title": "This is a JSON title",
    "isCool": true,
    "subItem": {
        "title": "sub-item title"
    },
    "tags": [
        "some tag",
        "another tag",
        "a third tag"
    ]
}

Loop through a list of 4 properties

Output

title (System.String) = This is a JSON title
isCool (System.Boolean) = True
subItem (ToSic.Sxc.Data.DynamicJacket) = { "title": "sub-item title" }
tags (ToSic.Sxc.Data.DynamicJacketList) = [ "some tag", "another tag", "a third tag" ]

<ol>
@foreach (var prop in thing) {
  <li><strong>@prop</strong> (@thing[prop].GetType()) = @thing[prop]</li>
}
</ol>

Source Code of demo.json{
    "title": "This is a JSON title",
    "isCool": true,
    "subItem": {
        "title": "sub-item title"
    },
    "tags": [
        "some tag",
        "another tag",
        "a third tag"
    ]
}

Go backwards - find Books pointing to Authors with Parents(...)

#1 Introduction to JSON

Get DataSources in Code - Introduction

Source Code of this file

Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
@using System.Linq;
<!-- unimportant stuff, hidden -->


<div @Sys.PageParts.InfoWrapper()>
  @Html.Partial("../shared/DefaultInfoSection.cshtml")
  <div @Sys.PageParts.InfoIntro()>
    <h2>Working with JSON Data</h2>
    <p>
      JSON data can be tricky. The easiest way is to convert it to a dynamic object using <code>AsDynamic(string)</code>. Then you can easily use it in your code. 
    </p>
  </div>
</div>


<h3>Show properties and sub-properties - case insensitive</h3>

  @{
      var someJson = System.IO.File.ReadAllText(App.PhysicalPath + "/json/demo.json");
      var thing = AsDynamic(someJson);
    }
  <ul>
    <li>Title: @thing.Title</li>
    <li>Description: @thing.IsCool</li>
    <li>Sub-item title: @thing.SubItem.Title</li>
    <li>Is this a list/array? @thing.IsList </li>
    <li>Are the tags a list? @thing.Tags.IsList </li>
  </ul>



<h3>Loop through a list of @thing.Tags.Count tags</h3>

  <ol>
  @foreach (var tag in thing.Tags) {
    <li>@tag</li>
  }
  </ol>



<h3>Loop through a list of @thing.Count properties</h3>

  <ol>
  @foreach (var prop in thing) {
    <li><strong>@prop</strong> (@thing[prop].GetType()) = @thing[prop]</li>
  }
  </ol>



@* Footer *@
@Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })