Click here to Skip to main content
14,932,238 members
Please Sign up or sign in to vote.
2.00/5 (1 vote)
See more:
I want to display the content of selected row of a datagrid to textboxes when the row is selected.
How can I bind textbox with datagrid's row?

I am currently using Wpf toolkit datagrid and my datagrid's item source is binded with database.

Any hints or code would be apprecaited. :)
Posted
Updated 4-Sep-11 18:10pm
v2

1 solution

Hi Create two properties in your CodeBehind or ViewModel.
One for binding to the grid's "ItemsSource" property (OneWay), and one to the "SelectedItem" property (TwoWay).

I have created a test class to view as rows in the grid, it's called "MyClass" and holds three properties (Id, Name and Tester). It's important that these implements the "INotifyPropertyChanged" interface.

My test class:
C#
public class MyClass : DependencyObject, INotifyPropertyChanged
    {
        public static DependencyProperty IdProperty = DependencyProperty.Register("Id", typeof(Int32), typeof(MainWindowViewModel), new PropertyMetadata(0));
        public static DependencyProperty NameProperty = DependencyProperty.Register("Name", typeof(String), typeof(MainWindowViewModel), new PropertyMetadata(null));
        public static DependencyProperty TesterProperty = DependencyProperty.Register("Tester", typeof(Boolean), typeof(MainWindowViewModel), new PropertyMetadata(false));

        public Int32 Id
        {
            get { return (Int32)GetValue(IdProperty); }
            set
            {
                SetValue(IdProperty, value);
                NotifyPropertyChanged("Id");
            }
        }

        public String Name
        {
            get { return (String)GetValue(NameProperty); }
            set
            {
                SetValue(NameProperty, value);
                NotifyPropertyChanged("Name");
            }
        }

        public Boolean Tester
        {
            get { return (Boolean)GetValue(TesterProperty); }
            set
            {
                SetValue(TesterProperty, value);
                NotifyPropertyChanged("Tester");
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
        public void NotifyPropertyChanged(String PropertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(PropertyName));
        }
    }



The properties (in the ViewModel/CodeBehind)
C#
public ObservableCollection<MyClass> Items
        {
            get { return (ObservableCollection<MyClass>)GetValue(ItemsProperty); }
            set
            {
                SetValue(ItemsProperty, value);
                NotifyPropertyChanged("Items");
            }
        }

        public MyClass SelectedItem
        {
            get { return (MyClass)GetValue(SelectedItemProperty); }
            set
            {
                SetValue(SelectedItemProperty, value);
                NotifyPropertyChanged("SelectedItem");
            }
        }




Then create the binding (in the View)
XML
<Grid>
        <kit:DataGrid AutoGenerateColumns="False"
                      ItemsSource="{Binding Path=Items, Mode=OneWay}"
                      SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" Margin="0,0,0,50">
            <kit:DataGrid.Columns>
                <kit:DataGridTextColumn Header="Id" Binding="{Binding Id}" />
                <kit:DataGridTextColumn Header="Name" Binding="{Binding Name}" />
                <kit:DataGridTextColumn Header="Tester" Binding="{Binding Tester}" />
            </kit:DataGrid.Columns>
        </kit:DataGrid>
        <TextBlock Height="23" HorizontalAlignment="Left" Margin="22,0,0,15" VerticalAlignment="Bottom" Width="79"
                   Text="{Binding SelectedItem.Id}" />
        <TextBox Height="23" HorizontalAlignment="Left" Margin="107,0,0,15" VerticalAlignment="Bottom" Width="120"
                 Text="{Binding SelectedItem.Name}"/>
            </Grid>


Then I create some items to wiew.

XML
this.Items = new ObservableCollection<MyClass>();
this.Items.Add(new MyClass() { Id = 1, Name = "John Johnson", Tester = false });
this.Items.Add(new MyClass() { Id = 2, Name = "Dan Danson", Tester = false });
this.Items.Add(new MyClass() { Id = 3, Name = "Peter Peterson", Tester = false });


When I run this, I see that the TextBlock and the TextBox will change according to the selected item in the grid.

Hope it helps!
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900