Binding hierarchical treeview from database
<p>I am totally new to using TreeView. My solution has two projects one called the Business Layer i.e a class library that gets data from the database and the other actual WPF application itself.</p>

<p>I have two very simple tables in my <code>Family</code> database that have data as follows:</p>

<p><a href="https://i.stack.imgur.com/Xa7xY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Xa7xY.png" alt="Database data"></a></p>

<p>I have four classes in my Business Layer project.</p>

<p>1) ChildrenModel.cs</p>

<pre><code>public class ChildrenModel
{
    public string Name { get; set; }
    public int Age { get; set; }
    public double Income { get; set; }
    public string Address { get; set; }
    public int FId { get; set; }
}
</code></pre>

<p>2) FamilyModel.cs</p>

<pre><code>public class FamilyModel
{
    public string Name { get; set; }

    public List&lt;ChildrenModel&gt; ChildenData { get; set; }
}
</code></pre>

<p>3) FamilyTemp.cs</p>

<pre><code>public class FamilyTemp
{
    public int id { get; set; }
    public string name { get; set; }
}
</code></pre>

<p>4) Finally DataRetrieval.cs to get the data from database. Here I have a very simple stored procedure that basically combines both <code>Family</code> and <code>Person</code> table. </p>

<p>I have the following class:</p>

<pre><code>public class DataRetrieval
   {
        List&lt;FamilyModel&gt; familyList = new List&lt;FamilyModel&gt;();
        List&lt;ChildrenModel&gt; childList = new List&lt;ChildrenModel&gt;();
        List&lt;FamilyTemp&gt; familyNames = new List&lt;FamilyTemp&gt;();
        using (SqlConnection con = new SqlConnection(@"Data Source=(LocalDB)\v11.0; AttachDbFilename=|DataDirectory|\Families.mdf; Integrated Security=True; Connect Timeout=30;"))
        {

            con.Open();
            //int count = 1;
            //int temp = 1;
            SqlCommand cmd = new SqlCommand("sp_GetFamilies", con);
            cmd.CommandType = CommandType.StoredProcedure;
            SqlDataReader dr = cmd.ExecuteReader();
            while (dr.Read())
            {
                ChildrenModel cModel = new ChildrenModel();
                cModel.Name = dr["PersonName"].ToString();
                cModel.Age = Convert.ToInt32(dr["PersonAge"]);
                cModel.Address = dr["PersonAddress"].ToString();
                cModel.Income = double.Parse(dr["PersonIncome"].ToString());
                cModel.FId = Convert.ToInt32(dr["FamilyId"]);
                childList.Add(cModel);

            }
            dr.Close();
            SqlCommand cmd1 = new SqlCommand("Select Distinct * from Family", con);
            SqlDataReader dr1 = cmd1.ExecuteReader();
            while (dr1.Read())
            {
                FamilyTemp ft = new FamilyTemp()
                {
                    id = Convert.ToInt32(dr1["Id"]),
                    name = dr1["Name"].ToString()
                };
                familyNames.Add(ft);
            }

            for (int i = 0; i &lt; familyNames.Count; i++)
            {
                FamilyModel fModelResult = new FamilyModel();
                fModelResult.Name = familyNames[i].name;
                foreach (var item in childList.Where(x =&gt; x.FId == familyNames[i].id).ToList())
                {
                    fModelResult.ChildenData.Add(item);
                }
                familyList.Add(fModelResult);
            }

        }
        return familyList;

    }

}
</code></pre>

<p>Now in the main WPF application I created a class called TreeViewModel as follows</p>

<pre><code>public class TreeViewModel:INotifyPropertyChanged
{
    private List&lt;FamilyModel&gt; _familyList;
    public List&lt;FamilyModel&gt; FamilyList
    {
        get
        {
            return _familyList;
        }
        set
        {
            _familyList = value;
            NotifiyPropertyChanged("FamilyList");
        }
    }
    public TreeViewModel()
    {

        FamilyList = DataRetrieval.familyData();
    }



    void NotifiyPropertyChanged(string property)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(property));
    }

    public event PropertyChangedEventHandler PropertyChanged;
}
</code></pre>

<p>Now in my main Window I want a hierarchical structure that looks in the last figure. So I have some sample xaml as follows. The datacontext is the TreeViewModel. What datatype should I mention and it dosent seem to bind the data to the treeview. please help what mistake am I doing.I get some wrong output as</p>

<p><a href="https://i.stack.imgur.com/kqluu.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kqluu.png" alt="enter image description here"></a></p>

<pre><code>&lt;!--
self namespace is:
xmlns:self="clr-namespace:BusinessLayer;assembly=BusinessLayer"
--&gt;
&lt;Grid&gt;
    &lt;TextBlock Text="Family Tree" Foreground="Red"&gt;&lt;/TextBlock&gt;
    &lt;TreeView Margin="10" Height="200"&gt;
        &lt;HierarchicalDataTemplate ItemsSource="{Binding FamilyList}" DataType="{x:Type self:FamilyModel}"&gt;
            &lt;StackPanel Orientation="Horizontal"&gt;
                &lt;TextBlock Text="{Binding Name}"&gt;&lt;/TextBlock&gt;
            &lt;/StackPanel&gt;
        &lt;/HierarchicalDataTemplate&gt;
        &lt;DataTemplate DataType="{x:Type self:ChildrenModel}"&gt;
            &lt;StackPanel Orientation="Horizontal"&gt;
                &lt;TextBlock Text="{Binding Name}"&gt;&lt;/TextBlock&gt;
                &lt;TextBlock Text="{Binding Age}"&gt;&lt;/TextBlock&gt;
            &lt;/StackPanel&gt;
        &lt;/DataTemplate&gt;

    &lt;/TreeView&gt;
&lt;/Grid&gt;
</code></pre>

<p>I want the treeview to look as follows,</p>

<p><a href="https://i.stack.imgur.com/XbTGE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XbTGE.png" alt="treeview"></a></p>