Deserializing nested JSON C# and Bind to XAML ListBox

At first you need to deserialize the json string, that for you can use Json.NET - if you need a c# class pattern, use this. Then you need to create a DataContext for your view (the page) and create a property in this to store your deserialzed json object. Your DataContext should implement the INotifyPropertyChanged interface. Then in the XAML create your ListBox and bind its ItemsSource property to the property in your DataContext. The next step is to create an ItemTemplate as a DataTemplate to style the ListBox's items just as you like then to look them like.

For your follower list you simply have to do the same, but instead of creating a new DataContext just use the properties of your binded items.

If you go to http://json2csharp.com/ and paste your json in there you will get the following objects

public class Comment{    public string task_comment_id { get; set; }    public string f_id { get; set; }    public string comment { get; set; }    public string created_date { get; set; }    public string updated_date { get; set; }}public class Follower{    public string f_id { get; set; }}public class TaskDetail{    public string task_id { get; set; }    public string created_f_id { get; set; }    public string task_description { get; set; }    public string due_date { get; set; }    public string alert { get; set; }    public string status { get; set; }    public string postedon { get; set; }    public string updatedon { get; set; }    public List<Comment> comments { get; set; }    public List<Follower> followers { get; set; }}public class RootObject{    public int status { get; set; }    public string message { get; set; }    public List<TaskDetail> Task_details { get; set; }}

Add all these classes to your project. In the backend you could do something like

var jsonString = @"{   "status":1,   "message":"sussess",   "Task_details":[      {         "task_id":"237",         "created_f_id":"100001",         "task_description":"task description",         "due_date":"2014-01-08 04:59:30",         "alert":"2",         "status":"1",         "postedon":"2014-01-07 11:29:29",         "updatedon":"2014-01-07 11:29:29",         "comments":[            {               "task_comment_id":"367",               "f_id":"100001588960161",               "comment":"sdfghhjfdsa",               "created_date":"2014-01-07 11:29:29",               "updated_date":"2014-01-07 11:29:29"            }         ],         "followers":[            {               "f_id":"1000011"            },            {               "f_id":"100004288170082"            },            {               "f_id":"184685"            }         ]      },      {         "task_id":"150",         "created_f_id":"184680",         "task_description":"testing",         "due_date":"2013-12-30 02:39:00",         "alert":"0",         "status":"1",         "postedon":"2013-12-30 09:10:22",         "updatedon":"2013-12-30 09:10:22",         "comments":[            {               "task_comment_id":"205",               "f_id":"184385",               "comment":"comment test",               "created_date":"2013-12-30 09:10:22",               "updated_date":"2013-12-30 09:10:22"            }         ],         "followers":[            {               "f_id":"1846806385"            },            {               "f_id":"100565"            },            {               "f_id":"100001561"            }         ]      }   ]}";                   var serializer =                        new DataContractJsonSerializer(typeof (RootObject));                    var context = (RootObject) serializer.ReadObject(jsonString);myListBox.ItemSource = context.Task_details;

This should solve all problems.

JOSN data can be managed by using JSON.Net and JSONORM. You can get it in Nuget by jsonorm

After getting data use data template in XAML. Here is an example. Create a window and paste this XAML.

<Window x:Class="DataTemplate.MainWindow"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    Title="MainWindow" Height="350" Width="525"><Window.Resources>    <DataTemplate x:Key="myTaskTemplate">        <Grid Height="115" Width="456">            <Grid.RowDefinitions>                <RowDefinition/>                    <RowDefinition/>                        <RowDefinition/>                          <RowDefinition/>            </Grid.RowDefinitions>            <Grid.ColumnDefinitions>                <ColumnDefinition/>        </Grid.ColumnDefinitions>            <TextBlock Grid.Row="0" Grid.Column="0"  Grid.ColumnSpan="5" Foreground="#FF0079C3" FontSize="15" FontFamily="Segoe UI Semilight" IsHyphenationEnabled="True"             LineStackingStrategy="BlockLineHeight" TextAlignment="Left" TextWrapping="Wrap" Text="{Binding task_id}"/>            <TextBlock  Grid.Row="1" Grid.Column="0" Foreground="#FF7F7F7F" FontSize="12" FontFamily="Segoe UI Semilight"             IsHyphenationEnabled="True" LineStackingStrategy="BlockLineHeight" Text="{Binding alert}" TextAlignment="Left"/>            <TextBlock  Grid.Row="2" Grid.Column="0" Foreground="#FF7F7F7F" FontSize="12" FontFamily="Segoe UI Semilight"             IsHyphenationEnabled="True" LineStackingStrategy="BlockLineHeight" Text="{Binding task_description}" TextAlignment="Left"/>                  <Path Grid.Row="3"  Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z"                 Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1"                 Stretch="Uniform"/>                   <Path Grid.Row="3"  Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z"                 Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1"                 Stretch="Uniform" RenderTransformOrigin="-1.087,0.548" Margin="0,1,31,-1"/>                   <Path Grid.Row="3"  Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z"                 Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1"                 Stretch="Uniform" RenderTransformOrigin="-1.087,0.548" Margin="0,0,63,0"/>        </Grid>    </DataTemplate></Window.Resources>    <ListBox Grid.Column="0" Grid.Row="1"         ItemsSource="{Binding Followers,IsAsync=True}"        ItemTemplate="{StaticResource myTaskTemplate}" ScrollViewer.HorizontalScrollBarVisibility="Disabled"         HorizontalContentAlignment="Stretch" Margin="0,13,0,0"/>    <!---->        <!--"" -->

Follow the Datacontext

using System.Text;using System.Threading.Tasks;using InSync.appseconnect.Helper;using ObjectDAL;using jsonorm;public class DataContext : ObservableObjectGeneric<DataContext>{    private List<Task_details> _taskdetaillist;    public DataContext()    {        Followers = new Task_details().GetElementList("Task_details");    }    public List<Task_details> Followers    {        get        {            return _taskdetaillist;        }        set        {            _taskdetaillist = value;            OnPropertyChanged("Followers");        }    }}

Following is the ObjectDAL

using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using jsonorm;namespace ObjectDAL{public class Comment{    public string task_comment_id { get; set; }    public string f_id { get; set; }    public string comment { get; set; }    public string created_date { get; set; }    public string updated_date { get; set; }}public class Follower{    public string f_id { get; set; }}public class Task_details : LocalStorage<Task_details>{    public string task_id { get; set; }    public string created_f_id { get; set; }    public string task_description { get; set; }    public string due_date { get; set; }    public string alert { get; set; }    public string status { get; set; }    public string postedon { get; set; }    public string updatedon { get; set; }    public List<Comment> comments { get; set; }    public List<Follower> followers { get; set; }}public class TaskDetailList : LocalStorage<TaskDetailList>{    public int status { get; set; }    public string message { get; set; }    public List<Task_details> Task_details { get; set; }}

}