Tutorials » Silverlight tutorials »

Silverlight databinding examples: BindingMode Enumeration


In this chapter, I will explain the "BindingMode" enumeration and how to use it to establish a TwoWay databinding.


In the previous chapter, I gave an introduction to databinding in Silverlight. In the previous example, we used the databinding mode "TwoWay". I will explain what it means and how to change the previous sample to make it a "real two way binding".

The DataBindingMode is an enumeration with 3 possible values:

OneTime: In this mode, the data is updated from the source to the target (UI) once. Any changes to the data source after this will not be reflected to the UI. This mode is used to display static data that does not change often.

OneWay: In this mode, the target will be updated as and when the source changes. This is useful if you need to display data which changes often in the background.

TwoWay: As the name indicates, this mode will update both ways. When the source changes, the target is updated. When the values in the target is changed, the source is updated.

In order to support the modes "OneWay" and "TwoWay", the binding source must implement the interface INotifyPropertyChanged. In addition, the properties of the data source must trigger the PropertyChanged event so that the databinding target will be notified of the changes in the source. Without this, the background changes on the data source will not be updated to the binding target.

Here is the source code of a sample Address class we can use to bind data to our UI controls:

using System.ComponentModel;

namespace DataBinding_Address
{
public class Address : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;

private string _name = "";

public string Name
{
get
{
return _name;
}
set
{
_name = value;

if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs("Name"));
}
}
}
}
}

I have included only 1 property (Name) in the above code. You may extend the class to add additional properties like City, State etc.

The above sample code shows it is raising the PropertyChanged event when the Name is updated for the object. This will notify the bound control about the change and the target control will update it's value accordingly.

The attached sample project uses a class called 'Address' as the data source. Each property of the address object is bound to a TextBlock control in the UI using "TwoWay" binding mode. When user type any text in the UI controls, the data is updated to the address object data source. Similarly, if the address object is changed in the background, the UI is automatically updated.

The UI include a "Clear" button. On the click event of this button, I am reseting the properties of the address object to empty string.

private void btnClear_Click(object sender, RoutedEventArgs e)
{
address.Name = string.Empty;
address.Address1 = string.Empty;
address.Address2 = string.Empty;
address.City = string.Empty;
address.State = string.Empty;
address.Zipcode = string.Empty;
}

Through the 2-way databinding, this will automatically clear the text in the respective UI controls.

You can download a sample project for this tutorial.



Next Chapter: How to set a background image for your Silverlight control
Previous Chapter: Introduction to DataBinding in Silverlight
More Chapters: Silverlight Tutorials
More Tutorials: Tutorial Index



Top Contributors
Today
    Last 7 Daysmore...

    Awards & Gifts

    Online Members

    More...
     
    Copyright © SpiderWorks Technologies Pvt Ltd., Kochi, India