Binding Fields to Database and display them in XamDataGrid

889 Views Asked by At

Good morning

I am facing a really big problem in binding my fields, which are all XamComboBoxEditors, to the XamDataGrid

In my database I have 2 Tables:

Account

public int AccountId { get; set; }
public string Code { get; set; }
public string Code2 { get; set; }
public string Name { get; set; }
public int Parent { get; set; }

and Acc_Link

public int Acc_LinkId { get; set; }
public string Acc_LinkTitle { get; set; }

I need to display in my XamDataGrid 3 combobox columns:

Account Title combobox which contains all the Acc_LinkTitles in the Acc_Link table

A Code combobox which contains all the codes in Account table

A Name combobox which contains all the names in Account table

In Order to facilitate my work, I created a class called Acc_LinkObsrvable that includes the above fields

but no matter how I try, nothing displays in the XamDataGrid when I run the code. I tried adding the code in the FieldInitialized event in the main so that it would load when the code it run but again nothing appeared

I will post my code, please help me.

Acc_LinkObsrvable class:

public string Acc_LinkTitle { get; set; }
public string Code { get; set; }
public string Name { get; set; }

XAML:

<igDP:XamDataGrid DataSource= "{Binding Path=Acc_LinkObservable}" Name="Account_Info_XamDataGrid" FieldLayoutInitialized ="Account_Info_XamDataGrid_FieldLayoutInitialized"  BindToSampleData="False" FieldLayoutInitialized = "Account_Info_XamDataGrid_FieldLayoutInitialized">
<igWPF:XamDataGrid.FieldLayoutSettings>
<igWPF:FieldLayoutSettings AutoGenerateFields="False" />
</igWPF:XamDataGrid.FieldLayoutSettings>
</igDP:XamDataGrid>

In main window:

private void Account_Info_XamDataGrid_FieldLayoutInitialized(object sender, FieldLayoutInitializedEventArgs e)
{
 ComboBoxItemsProvider title_provider = new ComboBoxItemsProvider();
ComboBoxItemsProvider code_provider = new ComboBoxItemsProvider();
ComboBoxItemsProvider name_provider = new ComboBoxItemsProvider();

List<Acc_LinkDTO> Acc_lists = new List<Acc_LinkDTO>();
List<AccountDTO> accounts = new List<AccountDTO>();
FieldLayout fieldLayout = new FieldLayout();

Acc_lists = _Acc_LinkUIAdapter.getAllAcc_Links();
accounts = _AccountUIAdapter.getALlGroup();

//Returns a list of all Account titles
foreach (var x in Acc_lists)
{
    int i = 0;
    title_provider.Items.Add(new ComboBoxDataItem(i, x.Acc_LinkTitle));
    i++;
}
//Returns a list of all codes and names
foreach (var x in accounts)
{
    int i = 0;
    code_provider.Items.Add(new ComboBoxDataItem(i, x.Code));
    name_provider.Items.Add(new ComboBoxDataItem(i, x.Name));
    i++;
}

//First column
Style style1 = new Style(typeof(XamComboEditor));
style1.Setters.Add(new Setter(XamComboEditor.ItemsProviderProperty, title_provider));
var fld1 = new Field()
{
    Name="Acc_LinkTitle",
    Label = "Account Title",
    AlternateBinding = new Binding("Acc_LinkDTO.Acc_LinkTitle"),
    EditorStyle = style1,
    EditorType = typeof(XamComboEditor)
};

e.FieldLayout.Fields.Add(fld1); 

//Second column
Style style2 = new Style(typeof(XamComboEditor));
style2.Setters.Add(new Setter(XamComboEditor.ItemsProviderProperty, code_provider));
var fld2 = new Field()
{
    Name="Code",
    Label = "Code",
    AlternateBinding = new Binding("AccountDTO.Code"),
    EditorStyle = style2,
    EditorType = typeof(XamComboEditor)
};

e.FieldLayout.Fields.Add(fld2); 

//Third column
Style style3 = new Style(typeof(XamComboEditor));
style1.Setters.Add(new Setter(XamComboEditor.ItemsProviderProperty, name_provider));
var fld3 = new Field()
{
    Name="Name",
    Label = "Name",
    AlternateBinding = new Binding("AccountDTO.Name"),
    EditorStyle = style3,
    EditorType = typeof(XamComboEditor)
};

e.FieldLayout.Fields.Add(fld3); 
}
2

There are 2 best solutions below

2
On BEST ANSWER

This example demonstrate different approach. All fields defined in the XAML. And the ComboBoxField is used instead of the XamComboEditor.

MainWindow.xaml

<Window x:Class="XamDataGridDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"           
        xmlns:igWPF="http://infragistics.com/DataPresenter"        
        xmlns:igDP="http://infragistics.com/DataPresenter"        
        xmlns:viewModel="clr-namespace:XamDataGridDemo.ViewModel"
        Title="XamDataGrid Demo" Height="350" Width="525" >
    
    <Window.Resources>
        <ResourceDictionary>
            <viewModel:CategoriesList x:Key="Categories" />
        </ResourceDictionary>
    </Window.Resources>
    <Grid>
        <igWPF:XamDataGrid x:Name="xamDataGrid1" DataSource="{Binding Path=Products}" Margin="10" >
            
            <igDP:XamDataGrid.FieldLayoutSettings>
                <igDP:FieldLayoutSettings SelectionTypeRecord="None" SelectionTypeField="None" SelectionTypeCell="None" 
                                          AutoGenerateFields="False" HeaderPrefixAreaDisplayMode="None" RecordSelectorLocation="None" >
                </igDP:FieldLayoutSettings>
            </igDP:XamDataGrid.FieldLayoutSettings>
           
            <igDP:XamDataGrid.FieldLayouts>
                <igDP:FieldLayout>
                    <igDP:FieldLayout.Fields>
                        <igDP:Field Label="Name" BindingType="UseAlternateBinding" AlternateBinding="{Binding Path=Name}" HorizontalContentAlignment="Right">
                            <igDP:Field.Settings>
                                <igDP:FieldSettings Width="Auto" AllowEdit="True" />
                            </igDP:Field.Settings>
                        </igDP:Field>
                        <igDP:ComboBoxField Name="Category" Label="Category"
                                            ItemsSource="{Binding Source={StaticResource Categories}}"
                                            DisplayMemberPath="Name" />

                        <igDP:Field Label="Stock" BindingType="UseAlternateBinding" AlternateBinding="{Binding Path=Stock}" HorizontalContentAlignment="Right">
                            <igDP:Field.Settings>
                                <igDP:FieldSettings Width="Auto" AllowEdit="True" />
                            </igDP:Field.Settings>
                        </igDP:Field>
                    </igDP:FieldLayout.Fields>
                </igDP:FieldLayout>
            </igDP:XamDataGrid.FieldLayouts>
        </igWPF:XamDataGrid>
    </Grid>    
</Window>

MainWindow.xaml.cs

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

namespace XamDataGridDemo
{
    public partial class MainWindow : Window
    {
        ObservableCollection<Product> Products = new ObservableCollection<Product>()
        {
            new Product("Porsche 911", "Car", 123),
            new Product("Lenox", "Bicycle", 45),
            new Product("Horizon", "Boat", 67)
        };

        public MainWindow()
        {
            InitializeComponent();
            xamDataGrid1.DataSource = Products;
        }
    }
}

CategoriesList.cs

using System.Collections.ObjectModel;
using Infragistics.Samples.Shared.Models;

namespace XamDataGridDemo.ViewModel
{
    public class CategoriesList : ObservableCollection<CategoryItem>
    {
        public CategoriesList()
        {
            this.Add(new CategoryItem() { Name = "Car" });
            this.Add(new CategoryItem() { Name = "Bicycle" });
            this.Add(new CategoryItem() { Name = "Boat" });
        }
    }

    public class CategoryItem : ObservableModel
    {
        private string _name;
        public string Name
        {
            get
            {
                return this._name;
            }
            set
            {
                if (this._name != value)
                {
                    this._name = value;
                    this.OnPropertyChanged("Name");
                }
            }
        }
    }
}

Product.cs

using System;
using System.ComponentModel;

namespace XamDataGridDemo
{
    public class Product : INotifyPropertyChanged
    {     
        public Product(string name, string category, int stock)
        {
            _name = name;
            _category = category;
            _stock = stock;
        }

        public string Name
        {
            get { return _name; }
            set
            {
                if (_name != value)
                {
                    _name = value;
                    NotifyPropertyChanged("Name");
                }
            }
        }

        public string Category
        {
            get { return _category; }
            set
            {
                if (_category != value)
                {
                    _category = value;
                    NotifyPropertyChanged("Category");
                }
            }
        }

        public int Stock
        {
            get { return _stock; }
            set
            {
                if (_stock != value)
                {
                    _stock = value;
                    NotifyPropertyChanged("Stock");
                }
            }
        }

        public string _name;
        public string _category;
        public int _stock;

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String info)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(info));
        }
    }
}

The following class is copied from the Infragistics SDK.

ObservableModel.cs

using System.ComponentModel;
using System.Runtime.Serialization;

namespace Infragistics.Samples.Shared.Models
{
    [DataContract]
    public abstract class ObservableModel : INotifyPropertyChanged 
    {
        protected ObservableModel()
        {
            IsPropertyNotifyActive = true;
        }

        #region INotifyPropertyChanged  

        public bool IsPropertyNotifyActive { get; set; }

        public event PropertyChangedEventHandler PropertyChanged;
        
        protected bool HasPropertyChangedHandler()
        {
            PropertyChangedEventHandler handler = this.PropertyChanged;
            return handler != null;
        }
        protected void OnPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            PropertyChangedEventHandler handler = this.PropertyChanged;
            if (handler != null && IsPropertyNotifyActive)
                handler(sender, e);
        }
        protected void OnPropertyChanged(PropertyChangedEventArgs e)
        {
            OnPropertyChanged(this, e);
        }
        protected void OnPropertyChanged(object sender, string propertyName)
        {
            OnPropertyChanged(sender, new PropertyChangedEventArgs(propertyName));
        }
        protected virtual void OnPropertyChanged(string propertyName)
        {
            OnPropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
        protected delegate void PropertyChangedDelegate(object sender, string propertyName);

        #endregion
    }
}

If run this code the application window will looks like below:

enter image description here

6
On

The Acc_LinkObservable class should implement the INotifyPropertyChanged interface. For example:

  public class Acc_LinkObservable : INotifyPropertyChanged
    {     
        public Acc_LinkObservable(string title, string code, string name)
        {
            _acc_LinkTitle = title;
            _code = code;
            _name = name;
        }

        public string Acc_LinkTitle
        {
            get { return _acc_LinkTitle; }
            set
            {
                if (_acc_LinkTitle != value)
                {
                    _acc_LinkTitle = value;
                    NotifyPropertyChanged("Acc_LinkTitle");
                }
            }
        }

        public string Code
        {
            get { return _code; }
            set
            {
                if (_code != value)
                {
                    _code = value;
                    NotifyPropertyChanged("Code");
                }
            }
        }

        public string Name
        {
            get { return _name; }
            set
            {
                if (_name != value)
                {
                    _name = value;
                    NotifyPropertyChanged("Name");
                }
            }
        }

        public string _acc_LinkTitle;
        public string _code;
        public string _name;

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String info)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(info));
        }
    }

After that the data source for the XamDataGrid might be defined like below: ObservableCollection<Acc_LinkObservable> AccountInfo

And accordingly in the XAML: <igDP:XamDataGrid DataSource= "{Binding Path=AccountInfo}"

Now it is necessary to fill the AccountInfo.

Remove AccountDTO from data binding path:

 AlternateBinding = new Binding("Name"),

Check possible misprint in definition of the style3 (style1 instead of style3):

Style style3 = new Style(typeof(XamComboEditor));
style1.Setters.Add(new Setter(XamComboEditor.ItemsProviderProperty, name_provider));