Binding Source Objects in WPF

(The source code is attached for Download.)

Recently I received a request from one of the followers on ways to bind source objects. So, I thought it would be a nice topic for an article. Hence, it's here.

For a binding to work, there should be a source object. The selection of source object is totally dependent on the way binding is used. If no binding source is provided, then bydefault DataContext of an element is used. The most common way is to set DataContext on parent element and let it flow to all its children. But apart from this, there are 3 other ways by which one can point to the source object:

1. RelativeSource: Relative source is one of the properties on a binding that can point to relative source markup extension that tells where the source can be found in hierarchy. In simple words, it is the relative path in the element hierarchy.

2. ElementName: Another way of specifying a source is by using an ElementName in which another element is present in the current UI that can be used as a source object. Here the source object must be part of the visual tree.

3. Source: Another way is by using the Source property on a binding. This source property must point to some object reference and the only better way to get an object reference down into the Source property is to use a static resource that points to some object in a resource collection.

Now let's quickly jump to the code of each one of these. To make my example simple, I am using only the two fields Employee Id and Employee Name and will display them in a WPF DataGrid.

As a ground work, I created a file to handle my data access part called DAL.cs. My all the business entities are kept in class called Employee and are populated in a DAL class. The following is the snapshot of both my classes:



And the following is my XAML skeleton to display the data in the DataGrid:



You might notice that by this time, I haven't set the DataContext and ItemsSource properties for my DataGrid. So, if you will run this application, your DataGrid will be empty with zero tupples. Going forward, I'll pick each one of the binding sources to populate the DataGrid. Let's use Relative Binding as the first one.

Using RelativeSource

The common practice for setting a DataContext in code-behind is by using the "this" keyword. What if we don't want to set this in code-behind using the "this" keyword? Well, the answer here is RelativeSource as shown below:



Setting the RelativeSource to Self is equivalent to this. So, one does not need to set DataContext in code-behind.

Using Source

Here we will see the Binding Source property on a binding. Let's say I want to set the ItemsSource as Employees and don't want to rely on the DataContext that has been set to something that was exposed to the Employees collection. In that case, I can point explicitly to some Source object that contains my collection. And the typical way of doing this is by using Resources on the current view and further set that resource as the key as the ItemsSource. The code will be:



And you will see the output as:



Using ElementName

To demonstrate this property, I will modify the above sample a bit by adding a Delete button. This delete button will delete the selected row. To do this, I hooked a button and respective command as shown below:



Please note, here DataContext of the button is coming from the parent that is the Window itself. Here we are using CommandParameter because we need to send the selected row as a parameter to our command. The point to note here is, we need to set the ElementName property with our DataGrid because our selected employee will be part of the DataGrid and the Path property with the SelectedItem.

If everything is in place, you are ready to go. I hope you enjoyed learning!