CODEWITHSUNDEEP
silverlightdata-bindingobservablecollection
Dirk
Dirk

Reputation: 23

Bind to a class within ObservableCollection<T>

I am trying to bind a Silverlight Datagrid to an ObservableCollection<T>.

Specifically I have ObservableCollection<Target> where target has the following properties: Hierarchy and Item.

I only want the datagrid to display information for the Hierarchy class but when the user selects a row I want both the Hierarchy and the item properties of the Target class to be available in code.

Is this possible?

Thanks.

Upvotes: 2

Views: 1019

Answers (2)

iCollect.it Ltd
iCollect.it Ltd

Reputation: 93571

Specify paths for the Hierarchy properties in your columns like this:

Binding="{Binding Hierarchy.Title}"

Full example below:

MainPage.xaml

<UserControl x:Class="GridBinding.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

    <Grid x:Name="LayoutRoot" Background="White">
        <sdk:DataGrid ItemsSource="{Binding Targets}" AutoGenerateColumns="False" Name="dataGrid1" SelectionChanged="dataGrid1_SelectionChanged">
            <sdk:DataGrid.Columns>
                <sdk:DataGridTextColumn Header="Title" Binding="{Binding Hierarchy.Title}" Width="Auto" />
                <sdk:DataGridTextColumn Header="Text" Binding="{Binding Hierarchy.Text}" Width="Auto" />
            </sdk:DataGrid.Columns>
        </sdk:DataGrid>
    </Grid>
</UserControl>

MainPage.cs

using System.Collections.ObjectModel;
using System.Windows.Controls;

namespace GridBinding
{
    public partial class MainPage : UserControl
    {
        public ObservableCollection<Target> Targets { get; set; }

        public MainPage()
        {
            InitializeComponent();
            this.Targets = new ObservableCollection<Target>()
                            {
                                new Target(){ Hierarchy = new Hierarchy(){Text = "Text 1", Title = "Title 1"}, Item = new Item(){Name = "Name 1"}},
                                new Target(){ Hierarchy = new Hierarchy(){Text = "Text 2", Title = "Title 2"}, Item = new Item(){Name = "Name 2"}},
                                new Target(){ Hierarchy = new Hierarchy(){Text = "Text 3", Title = "Title 3"}, Item = new Item(){Name = "Name 2"}},
                            };
            this.DataContext = this;
        }

        private void dataGrid1_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            DataGrid dataGrid = sender as DataGrid;
            Target target = dataGrid.SelectedItem as Target;
            Hierarchy heirarchy = target.Hierarchy;
            Item item = target.Item;
        }
    }

    public class Target
    {
        public Hierarchy Hierarchy { get; set; }
        public Item Item { get; set; }
    }

    public class Hierarchy
    {
        public string Title { get; set; }
        public string Text { get; set; }
    }

    public class Item
    {
        public string Name { get; set; }
    }
}

Upvotes: 1

ColinE
ColinE

Reputation: 70142

Yes, this is possible. Firstly, set AutoGenerateColumns to false on your grid, then manually add a column for the property or properties you wish to display. Set your ObservableCollection<Target> as the ItemsSource for your DataGrid.

When the user selects a row, the selected Target instance will be available via the DataGrid.SelectedItem property, allowing you to look at all of its properties.

Upvotes: 0

Related Questions