Wpf – Getting the Change Event from a Checkbox in a grid using WPF/MVVM

checkboxmvvmwpf

I have a dataset that is essentially a list of objects with a boolean property in them that is bound to a DataGrid (DXGrid to be specific). I am trying to get the IsChecked property to populate on the clicking of the checkbox. In the case of a standalone textbox, i would use the UpdateSourceTrigger option of Binding, but in the DXGrid at least, that doesn't seem to be available. As it is, I have to lose focus of the checkbox in order to update the property.

Any Ideas?

Assume that the RaisePropertyChanged function below is an implementation of INotifyPropertyChanged.

Data Object

public class MyObject
{
  bool _isChecked;
  string _name;
  int _id;

  public MyObject(OtherObject oo)
  {
       _name = oo.Name;
       _id = oo.ID;
  }

  public int ID
  { get { return _id; }}

  public string Name
  { get { return _name; }}

  public bool IsChecked
  {
      get { return _isChecked; }
      set
      {
          if (value == _isChecked)
              return;
          _isChecked = value;
          RaisePropertyChanged("IsChecked");
      }
  }
}    

ViewModel

class MyTestViewModel : BaseViewModel
{
    #region Fields
    #endregion

    public MyTestViewModel(Message message)
        : base(message)
    {
        AvailableObjects = PopulateDataSet();
    }

    #region Properties
    public List<MyObject> AvailableObjects { get; set; }
}

view XAML

  <dxg:GridControl x:Name="SearchGrid" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" MaxHeight="1024" AutoPopulateColumns="True" DataSource="{Binding Path=AvailableObjects}" >
      <dxg:GridControl.Columns>
          <dxg:GridColumn Header="Select" Width="60" FixedWidth="True" FieldName="IsChecked" ImmediateUpdateColumnFilter="True"></dxg:GridColumn>
          <dxg:GridColumn Header="ID Number" Width="130" FixedWidth="True" ReadOnly="True"  FieldName="ID"></dxg:GridColumn>
          <dxg:GridColumn Header="Name"  FieldName="Name" ReadOnly="True"></dxg:GridColumn>
      </dxg:GridControl.Columns>
      <dxg:GridControl.View>
          <dxg:TableView AllowEditing="True" x:Name="view" IndicatorWidth="0" AutoWidth="True"/>
      </dxg:GridControl.View>
  </dxg:GridControl>

Best Answer

Give this a try:

                    <dxg:GridColumn>
                    <dxg:GridColumn.CellTemplate>
                        <DataTemplate>
                            <dxe:CheckEdit Checked="{Binding Path=IsChecked, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
                        </DataTemplate>
                    </dxg:GridColumn.CellTemplate>
                </dxg:GridColumn>