Setting DataContext elements inside XAML?

Question

Hi, I'm trying to get a binding binding.

XAML Code:

<Window x:Class="WPF_SandBox.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <StackPanel x:Name="stackPanel"> <TextBox x:Name="textBox_FirstName" Width="200" Margin="0,100,0,0" Text="{Binding Path=FirstName, UpdateSourceTrigger=PropertyChanged}" /> <TextBox x:Name="textBox_LastName" Width="200" Margin="0,10,0,0" Text="{Binding Path=LastName, UpdateSourceTrigger=PropertyChanged}" /> <TextBlock x:Name="textBlock_FullName" Background="LightBlue" Width="200" Margin="0,10,0,0" Text="{Binding Path=FullName, UpdateSourceTrigger=PropertyChanged}" /> </StackPanel> </Window> 

C # code:

 public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); Person person = new Person { FirstName = "Matt", LastName = "Smith" }; stackPanel.DataContext = person; } } public class Person : INotifyPropertyChanged { string firstName; string lastName; public string FirstName { get { return firstName; } set { firstName = value; OnPropertyChanged("FirstName"); OnPropertyChanged("FullName"); } } public string LastName { get { return lastName; } set { lastName = value; OnPropertyChanged("LastName"); OnPropertyChanged("FullName"); } } public string FullName { get { return String.Format("{0}, {1}",lastName,firstName); } } public event PropertyChangedEventHandler PropertyChanged; private void OnPropertyChanged(string propName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propName)); } } } 

At startup, a window with 2 text fields and 1 text block is displayed. Inside the window constructor, I instantiated the person and assigned a DataContext to the stackPanel for this instance. The first text field is bound to the FirstName property of the Person class, the second TextBox is bound to the LastName property, and the last TextBlock simply prints the LastName property, followed by the FirstName properties. As I said earlier, I set the DataContext for the stackPanel inside C # code. How can I install it instead of XAML? For instance:

 <StackPanel x:Name="stackPanel" DataContext="person"> <TextBox x:Name="textBox_FirstName" Width="200" Margin="0,100,0,0" Text="{Binding Path=FirstName, UpdateSourceTrigger=PropertyChanged}" /> <TextBox x:Name="textBox_LastName" Width="200" Margin="0,10,0,0" Text="{Binding Path=LastName, UpdateSourceTrigger=PropertyChanged}" /> <TextBlock x:Name="textBlock_FullName" Background="LightBlue" Width="200" Margin="0,10,0,0" Text="{Binding Path=FullName, UpdateSourceTrigger=PropertyChanged}" /> </StackPanel> 

This does not work, but as you can see, I'm trying to set the DataContext from the stackPanel inside XAML, how would I do it?

Thanks!

Answer 1

This short article explains two ways to set a DataContext: through XAML or through code. Here is the code:

 public class HelloWorldDataContextModel { public string HelloWorld { get; set; } public HelloWorldDataContextModel() { HelloWorld = "Hello world!"; } } 

And XAML:

 <Window x:Class="HelloWorldDataContext.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:HelloWorldDataContext" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <local:HelloWorldDataContextModel x:Key="HelloWorldDataContext" /> </Window.Resources> <Grid DataContext="{StaticResource HelloWorldDataContext}"> <TextBox HorizontalAlignment="Left" Height="23" Margin="222,127,0,0" TextWrapping="Wrap" Text="{Binding HelloWorld}" VerticalAlignment="Top" Width="120"/> </Grid> </Window> 

Answer 2

I don’t know why you are trying to set the DataContext from the StackPanel, although you can set the DataContext Window and use it further, but still, if you want to try this

Xaml

  <StackPanel x:Name="stackPanel" DataContext="{Binding Person}"> 

xaml.cs

  public partial class MainWindow : Window, INotifyPropertyChanged { public MainWindow() { InitializeComponent(); DataContext = this; Person = new Person { FirstName = "Matt", LastName = "Smith" }; } Person person; public Person Person { get { return person; } set { person = value; OnPropertyChanged("Person"); } } public event PropertyChangedEventHandler PropertyChanged; private void OnPropertyChanged(string propName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propName)); } } } 

Or instead of setting a DataContext from a StackPanel, use dataContext of Window and Bind textblock text as Person.FirstName .....

 <TextBox x:Name="textBox_FirstName" Width="200" Margin="0,100,0,0" Text="{Binding Path=Person.FirstName, UpdateSourceTrigger=PropertyChanged}" /> <TextBox x:Name="textBox_LastName" Width="200" Margin="0,10,0,0" Text="{Binding Path=Person.LastName, UpdateSourceTrigger=PropertyChanged}" /> <TextBlock x:Name="textBlock_FullName" Background="LightBlue" Width="200" Margin="0,10,0,0" Text="{Binding Path=Person.FullName, UpdateSourceTrigger=PropertyChanged}" /> 

Answer 3

To add to the Abbas answer, when you have a constructor without parameters, which, as you might find, is more common when using MVVM, you can also set the DataContext of the control in different ways.

 <Window x:Class="HelloWorldDataContext.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:HelloWorldDataContext" Title="MainWindow" Height="350" Width="525"> <Window.DataContext> <local:HelloWorldDataContextModel /> </Window.DataContext> <Grid> <TextBox HorizontalAlignment="Left" Height="23" Margin="222,127,0,0" TextWrapping="Wrap" Text="{Binding HelloWorld}" VerticalAlignment="Top" Width="120"/> </Grid> </Window> 

You will get the same result using the my or Abbas method; however, when a parameter is required by the constructor, you should not do this.