如何在WPF中获取DevExpress GridControl的选定行值？

Question

I asked this question in Oct, 2012 when I was working on windows application. now when I turn to WPF application, I get the same problem again ie How to get the selected row values of DevExpress GridControl in WPF ? I've failed to find my answer on google and none of the answers in the above mentioned link is working. there is nothing like CellClick, RowClick or RowCellClick event in devexpress gridcontrol of wpf as it is in winform gridcontrol. I'll be glad if someone can solve out this problem

Edit

I have updated my application with required namespaces as you updated in your answer but the problem remains the same. i'm getting following tow errors in

<Grid.DataContext>
        <dxmvvm:ViewModelSource Type="{x:Type local:EntitiesViewModel}"/>
    </Grid.DataContext>

1- the type 'dxmvvm:ViewModelSource'" was not found in dxmvvm:ViewModelSource

2- name "EntitiesViewModel" does not exist in the namespace "clr-namespace:DXApplication1"

my application coding is as follows

XAML

<dx:DXWindow
    x:Class="DXApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:DXApplication1"
    xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
    xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
    xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
    xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
    Title="DXApplication" Height="700" Width="1100"
    SnapsToDevicePixels="True" UseLayoutRounding="True">

    <dx:DXWindow.Resources>
    </dx:DXWindow.Resources>

    <Grid Margin="12">
        <Grid.DataContext>
            <dxmvvm:ViewModelSource Type="{x:Type local:EntitiesViewModel}"/>
        </Grid.DataContext>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0" Margin="0,0,0,8">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="8"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Label Content="Item1" Grid.Row="0" VerticalAlignment="Center"/>
            <Label Content="Item2" Grid.Row="1" VerticalAlignment="Center"/>
            <Label Content="Item3" Grid.Row="2" VerticalAlignment="Center"/>
            <dxe:TextEdit Text="{Binding SelectedEntity.Item1}" Grid.Row="0" Grid.Column="2"/>
            <dxe:TextEdit Text="{Binding SelectedEntity.Item2}" Grid.Row="1" Grid.Column="2"/>
            <dxe:TextEdit Text="{Binding SelectedEntity.Item3}" Grid.Row="2" Grid.Column="2"/>
        </Grid>
        <dxg:GridControl Grid.Row="1" 
                     AutoGenerateColumns="None" 
                     ItemsSource="{Binding Entities}"
                     SelectedItem="{Binding SelectedEntity}">
            <dxg:GridControl.Columns>
                <dxg:GridColumn FieldName="Item1"/>
                <dxg:GridColumn FieldName="Item2"/>
                <dxg:GridColumn FieldName="Item3"/>
            </dxg:GridControl.Columns>
            <dxg:GridControl.View>
                <dxg:TableView ShowTotalSummary="True" AllowEditing="False"/>
            </dxg:GridControl.View>
        </dxg:GridControl>
    </Grid>
</dx:DXWindow>

EntitiesViewModel

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Collections.ObjectModel;

namespace DXApplication1
{
    public class EntitiesViewModel
    {
        public EntitiesViewModel()
        {
            LoadEntities();
        }
        void LoadEntities()
        {
            Entities = new ObservableCollection<Entity>
        {
            new Entity(){ Item1="A", Item2="A0", Item3="A00"},
            new Entity(){ Item1="B", Item2="B0", Item3="B00"},
            new Entity(){ Item1="C", Item2="C0", Item3="C00"},
        };
        }
        public ObservableCollection<Entity> Entities { get; private set; }
        public virtual Entity SelectedEntity { get; set; } // Bindable property
    }
    public class Entity
    {
        public string Item1 { get; set; }
        public string Item2 { get; set; }
        public string Item3 { get; set; }
    }
}

Image for libraries, error, class etc

Answer 1

You can use DataControlBase.CurrentItemChanged event.
Here is example:
WPF:

<dxg:GridControl x:Name="gridControl1" ItemsSource="{Binding Data}" CurrentItemChanged="gridControl1_CurrentItemChanged">
</dxg:GridControl>

Event handler:

private void gridControl1_CurrentItemChanged(object sender, CurrentItemChangedEventArgs e)
{
    TBGRNo.Text = gridControl1.GetFocusedRowCellValue("GRNo").ToString();
    TBSName.Text = gridControl1.GetFocusedRowCellValue("SName").ToString();
    TBFName.Text = gridControl1.GetFocusedRowCellValue("FName").ToString();    
}

Answer 2

Look at the selection topic in the documentation at the Devexpress Homepage: Grid Selection Topic

If you are using the MVVM pattern you should also have a look at the SelectedItems Property . The example there shows how to bind to the selected items:

<dxg:GridControl ItemsSource="{Binding Source}" SelectedItems="{Binding Selection}">

Answer 3

I found the solution as follows

<Grid>
    <dxg:GridControl Name="gridcontrol" AutoGenerateColumns="AddNew" HorizontalAlignment="Left" Margin="23,139,0,0" VerticalAlignment="Top" Height="315" Width="575">
        <dxg:GridControl.Columns>
            <dxg:GridColumn FieldName="Item1"/>
            <dxg:GridColumn FieldName="Item2"/>
            <dxg:GridColumn FieldName="Item3"/>
        </dxg:GridControl.Columns>
        <dxg:GridControl.View>
            <dxg:TableView Name="gridview" ShowTotalSummary="True" AllowEditing="False"/>
        </dxg:GridControl.View>
    </dxg:GridControl>
    <dxe:TextEdit Name="TBItem1" Text="{Binding SelectedItem.Item1, ElementName=gridcontrol, Mode=OneWay}" HorizontalAlignment="Left" Margin="124,10,0,0" VerticalAlignment="Top" Width="150"/>
    <dxe:TextEdit Name="TBItem2" Text="{Binding SelectedItem.Item2, ElementName=gridcontrol, Mode=OneWay}" HorizontalAlignment="Left" Margin="124,49,0,0" VerticalAlignment="Top" Width="150"/>
    <dxe:TextEdit Name="TBItem3" Text="{Binding SelectedItem.Item3, ElementName=gridcontrol, Mode=OneWay}" HorizontalAlignment="Left" Margin="124,84,0,0" VerticalAlignment="Top" Width="150"/>
    <Label Content="Item1" HorizontalAlignment="Left" Margin="61,10,0,0" VerticalAlignment="Top" Width="48"/>
    <Label Content="Item2" HorizontalAlignment="Left" Margin="61,49,0,0" VerticalAlignment="Top"/>
    <Label Content="Item3" HorizontalAlignment="Left" Margin="61,80,0,0" VerticalAlignment="Top"/>
</Grid>

Answer 4

As far as I can see you're want to display list of entities, then provide an UI for selecting one of these entitites (via gridcontrol) and edit the selected entity properties in separate view (via text editors).

So, I suggest you to use the MVVM approach. And, since you are already using DevExpress controls, I suggest you use the DevExpress MVVM Framework to make your MVVM as easy as it possible.

Step 1: Define a ViewModel class that contains your entities collection available via the Entities property (you can load these entities in way as it needed, from it needed and when it needed) and provide the SelectedEntity property:

public class EntitiesViewModel {
    public EntitiesViewModel() {
        LoadEntities();
    }
    void LoadEntities() {
        Entities = new ObservableCollection<Entity>
        {
            new Entity(){ Item1="A", Item2="A0", Item3="A00"},
            new Entity(){ Item1="B", Item2="B0", Item3="B00"},
            new Entity(){ Item1="C", Item2="C0", Item3="C00"},
        };
    }
    public ObservableCollection<Entity> Entities { get; private set; }
    public virtual Entity SelectedEntity { get; set; } // Bindable property
}
public class Entity {
    public string Item1 { get; set; }
    public string Item2 { get; set; }
    public string Item3 { get; set; }
}

Step 2: Define a View layout as follows:

...
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:DXApplication1"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
...
<Grid Margin="12">
    <Grid.DataContext>
        <dxmvvm:ViewModelSource Type="{x:Type local:EntitiesViewModel}"/>
    </Grid.DataContext>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Margin="0,0,0,8">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="8"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Label Content="Item1" Grid.Row="0" VerticalAlignment="Center"/>
        <Label Content="Item2" Grid.Row="1" VerticalAlignment="Center"/>
        <Label Content="Item3" Grid.Row="2" VerticalAlignment="Center"/>
        <dxe:TextEdit Text="{Binding SelectedEntity.Item1}" Grid.Row="0" Grid.Column="2"/>
        <dxe:TextEdit Text="{Binding SelectedEntity.Item2}" Grid.Row="1" Grid.Column="2"/>
        <dxe:TextEdit Text="{Binding SelectedEntity.Item3}" Grid.Row="2" Grid.Column="2"/>
    </Grid>
    <dxg:GridControl Grid.Row="1" 
                     AutoGenerateColumns="None" 
                     ItemsSource="{Binding Entities}"
                     SelectedItem="{Binding SelectedEntity}">
        <dxg:GridControl.Columns>
            <dxg:GridColumn FieldName="Item1"/>
            <dxg:GridColumn FieldName="Item2"/>
            <dxg:GridColumn FieldName="Item3"/>
        </dxg:GridControl.Columns>
        <dxg:GridControl.View>
            <dxg:TableView ShowTotalSummary="True" AllowEditing="False"/>
        </dxg:GridControl.View>
    </dxg:GridControl>
</Grid>

*The main points-of-interest and tricks are:
1) creating the EntitiesViewModel instance via the ViewModelSource. This way allows you do not implement the INotifyPropertyChanged interface at the ViewModel's level - you can just declare the SelectedEntity property as virtual and delegate all the dirty-work to the POCO mechanism :

<dxmvvm:ViewModelSource Type="{x:Type local:EntitiesViewModel}"/>

2) all View' controls bindings are "looks" into the DataContext (which contains our ViewModel):

...
Text="{Binding SelectedEntity.Item1}"
...
ItemsSource="{Binding Entities}"
SelectedItem="{Binding SelectedEntity}">

This way allows you to decouple all UI-controls from each other and modify the View with easy.