Multibinding XamDataGrid

Question

I am trying to use the following code example from the Infragistics site and I'd like edits in the XamDataCards to be reflected in the XamDataGrid. However, my DataSource for the XamDataGrid is an ObservableCollection<Companies> in my ViewModel. How can I also bind to the card and relay updates back to my Companies object in the ViewModel?

<igDP:XamDataGrid x:Name="dgCompanies" Theme="IGTheme" DataSource="{Binding Companies}" SelectedDataItemsScope="RecordsOnly">
  <igDP:XamDataGrid.FieldSettings>
    <igDP:FieldSettings CellClickAction="SelectCell" AllowEdit="True"/>
  </igDP:XamDataGrid.FieldSettings>
</igDP:XamDataGrid>
<igDP:XamDataCards x:Name="XamDataCards1"
                       Grid.Row="1"
                       DataSource="{Binding Path=SelectedDataItems, ElementName=dgCompanies}"
                       Theme="IGTheme">

Edit: Added ViewModel

public class CompanyMgmtViewModel : ViewModelBase
{
    private ObservableCollection<Object> _Companies = null;

    public ObservableCollection<Object> Companies
    {
        get { return _Companies; }
        set
        {
            if (_Companies != value)
            {
                _Companies = value;
                RaisePropertyChanged(GetPropertyName(() => Companies));
            }
        }
    }
    public CompanyMgmtViewModel()
    {
        this.LoadData();
    }

    public void LoadData()
    {
        ObservableCollection<Object> records = new ObservableCollection<Object>();

        var results = from res in AODB.Context.TCompanies
                      select res;
        foreach (var item in results)
            if (item != null) records.Add(item);
        Companies = records;
    }
}

The Model/Context code is just EF Database First generated.

Answer 1

I couldn't have gotten to this answer without Theodosius' and Ganesh's input - so thanks to them, they both had partial answers.

I first tried to bind the SelectedDataItems of the XamDataGrid to the XamDataCards by way of a property on the ViewModel as Theodosius suggested, but that wasn't enough. Thanks to Ganesh, I implemented INotifyPropertyChanged on my model objects, by inheriting from ObservableObject in MVVMLight (how did I not know the Model needed this?).

Below are the relevant pieces of code to make it work. I also implemented PropertyChanged.Fody as documented here; that's where the TypedViewModelBase<T> and removal of RaisePropertyChanged() comes from. I'm also creating my Model objects by using a LINQ/Automapper .Project().To<T>() call which can be found here.

Model

 public class Company : ObservableObject
{
    public Company() { }
    public int id { get; set; }
    public string strName { get; set; }
    public string strDomicileCode { get; set; }
}

ViewModel

public class CompanyMgmtViewModel : TypedViewModelBase<Company>
{
    private ObservableCollection<Object> _Companies = null;
    private Object[] _selectedCompany = null;

    public Object[] Company
    {
        get { return _selectedCompany; }
        set
        {
            if (_Company != value)
            {
                _selectedCompany = value;
            }
        }
    }

    public ObservableCollection<Object> Companies
    {
        get { return _Companies; }
        set
        {
            if (_Companies != value)
            {
                _Companies = value;
            }
        }
    }
    public CompanyMgmtViewModel()
    {
        this.LoadData();
    }

    public void LoadData()
    {
        ObservableCollection<Object> records = new ObservableCollection<Object>();

        var results = AODB.Context.TCompanies.Project().To<Company>();
        foreach (var item in results)
            if (item != null) records.Add(item);
        Companies = records;
    }
}

View

<igDP:XamDataGrid   x:Name="dgCompanies" 
                Theme="IGTheme"  
                DataSource="{Binding Companies, Mode=OneWay}" 
                SelectedDataItemsScope="RecordsOnly" 
                SelectedDataItems="{Binding Company}">
                  ...
<igDP:XamDataCards x:Name="XamDataCards1"
                       Grid.Row="1"
                       DataSource="{Binding ElementName=dgCompanies, Path=SelectedDataItems}"
                       Theme="IGTheme">                      

Answer 2

You would need to bind your XamDataGrid's SelectedDataItems property to a property of type object[] ie. SelectedCompanies in your ViewModel and bind to that for your XamDataCards' datasource.

The accepted answer in this thread has a sample that shows how to do this, albeit with a ListBox instead of XamDataCards: http://www.infragistics.com/community/forums/t/89122.aspx

Just replace that ListBox with your XamDataCards control, it works and updates the XamDataGrid. The ViewModel in the example is contained in the MainWindow code-behind, so it is MVVM like you want.

more info: http://help.infragistics.com/Help/Doc/WPF/2014.1/CLR4.0/html/xamDataGrid_Selected_Data_Items.html

IG's SelectedDataItems is an object[] : http://help.infragistics.com/Help/Doc/WPF/2014.1/CLR4.0/html/InfragisticsWPF4.DataPresenter.v14.1~Infragistics.Windows.DataPresenter.DataPresenterBase~SelectedDataItems.html