CODEWITHSUNDEEP
c#data-bindingsilverlight-5.0
Three Value Logic
Three Value Logic

Reputation: 1112

Binding Datagrid to ObservableCollection<T> in SIlverlight

I am struggling to bind a DataGrid to an ObservableCollection in SIlverlight.

My very simple code is below. It currently shows a blank DataGrid. I have gone through tutorials etc and I am sure I am missing something very very basic.

Main Page XAML

<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"  x:Class="Tower.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">

<Grid x:Name="LayoutRoot">
    <sdk:DataGrid Grid.Row="1" Margin="10" IsReadOnly="True" ColumnWidth="120" ItemsSource="{Binding Path=Tests, Mode=OneWay}" AllowDrop="True" />
</Grid>

Main Page Code Behind:

public partial class MainPage : UserControl
{
    public ObservableCollection<Test> Tests { get; set; }

    public MainPage()
    {
        InitializeComponent();

        DataContext = this;

        Tests = new ObservableCollection<Test>();
        Tests.Add(new Test() { Label = "Test1" });
        Tests.Add(new Test() { Label = "Test2" });
        Tests.Add(new Test() { Label = "Test3" });
        Tests.Add(new Test() { Label = "Test4" });
    }
}

Test Class:

public class Test : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged; 

    private String _Label;

    public String Label
    {
        get
        {
            return _Label;
        }
        set
        {
            _Label = value;
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs("Label"));
        }
    } 
}

Upvotes: 0

Views: 2012

Answers (3)

Johan Larsson
Johan Larsson

Reputation: 17580

  • For binding to work Tests has to be a public property. (I was surprised to see that the property needed to be public but could not get it to work without)
  • For referenceing the property in the binding you must either
  • Set the datacontext like RV suggested Or reference like this:
<Grid>
    <DataGrid ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=UserControl}, Path=Tests}" />
</Grid>

Upvotes: 1

Rohit Vats
Rohit Vats

Reputation: 81253

There are two issues in your code -

  • You can only bind with property and not with fields. so make Test property first.

  • Second, you need to set the DataContext to self for binding to work.

    public partial class MainPage : UserControl
{
   public ObservableCollection<Test> Tests { get; set; }

   public MainPage()
   {
       InitializeComponent();

       DataContext = this;

       Tests = new ObservableCollection<Test>();
       Tests.Add(new Test() { Label = "Test1" });
       Tests.Add(new Test() { Label = "Test2" });
       Tests.Add(new Test() { Label = "Test3" });
       Tests.Add(new Test() { Label = "Test4" });
   }
}

XAML -

<Grid x:Name="LayoutRoot">
    <sdk:DataGrid Grid.Row="1" Margin="10" IsReadOnly="True" ColumnWidth="120"
              ItemsSource="{Binding DataContext.Tests,
                RelativeSource={RelativeSource FindAncestor,
                 AncestorType= UserControl}}" AllowDrop="True" />
</Grid>

Notice propertyName - It should be Tests and not tests. This is just a side-note, follow the naming conventions of Microsoft. Property name's first letter should be uppercase always.

Upvotes: 1

jug
jug

Reputation: 451

Don't forget : PUBLIC ObservableCollection tests {get; private set}

Upvotes: 0

Related Questions