Introduction
In this article we will see how we can use default item in ComboBox in Silverlight 3.
Problem
Suppose you have a ComboBox, but Silverlight 3 doesn't give you support for using default selection. Consider you have many items in the ComboBox and you need to deselect to make the ComboBox to reset.
Creating Silverlight Project
Fire up Visual Studio 2008 and create a new Silverlight 3 Project. Name it as ComboBoxDefaultSample.
Add some controls along with a ComboBox.
I have designed in Expression blend which will look similar as follows:
As you see from the above image, we have a ComboBox a Button and a TextBlock which would say which item is selected from the ComboBox.
Here is the requirement: you should list all Business Units from the List and based on the Selection user can search.
We would write a class called BusinessUnit.cs where we would define the properties.
public class BusinessUnit : INotifyPropertyChanged
{
private long businessId;
public long Id
{
get { return businessId; }
set { businessId = value; }
}
private string businessUnitName;
public string Name
{
get { return businessUnitName; }
set
{
businessUnitName = Normalize(value);
if (string.IsNullOrEmpty(value))
{
throw new Exception("Business Unit is required");
}
OnPropertyChanged("Name");
}
}
private string businessUnitDescription;
public string Description
{
get { return businessUnitDescription; }
set
{
businessUnitDescription = Normalize(value);
if (string.IsNullOrEmpty(value))
{
throw new Exception("Business Unit Description is required");
}
OnPropertyChanged("Description");
}
}
private DateTime created;
public DateTime Created
{
get { return created; }
set { created = value; }
}
private string creator;
public string Creator
{
get { return creator; }
set { creator = value; }
}
private DateTime updated;
public DateTime Updated
{
get { return updated; }
set { updated = value; }
}
private string updater;
public string Updater
{
get { return updater; }
set { updater = value; }
}
private static readonly char[] whitespaces = new char[] { ' ', '\n', '\t', '\r', '\f', '\v' };
private static string Normalize(string source)
{
return String.Join(" ", source.Split(whitespaces, StringSplitOptions.RemoveEmptyEntries));
}
#region INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
#endregion
}
Now we will change the Binding in ComboBox.
The following XAML will help you.
<ComboBox x:Name="cmbBusinessUnits" HorizontalAlignment="Left" VerticalAlignment="Top" Width="175" Margin="64,106,0,0" Height="25">
<ComboBoxItem Content="All"/>
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}"/>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
As you see from the above XAML code, we have added a CombBoxItem as "All" and then we defined our ComboBox ItemTemplate with Binding.
Now we will create sample data and set the ItemSource.
List<BusinessUnit> myList;
public MainPage()
{
InitializeComponent();
myList = new List<BusinessUnit>()
{
new BusinessUnit{ Id=1, Name="BU 1", Description="Desc 1", Creator="User 1", Created=DateTime.Now, Updater="User 1", Updated=DateTime.Now},
new BusinessUnit{ Id=2, Name="BU 2", Description="Desc 2", Creator="User 2", Created=DateTime.Now, Updater="User 2", Updated=DateTime.Now},
new BusinessUnit{ Id=3, Name="BU 3", Description="Desc 3", Creator="User 3", Created=DateTime.Now, Updater="User 3", Updated=DateTime.Now},
new BusinessUnit{ Id=4, Name="BU 4", Description="Desc 4", Creator="User 4", Created=DateTime.Now, Updater="User 4", Updated=DateTime.Now},
new BusinessUnit{ Id=5, Name="BU 5", Description="Desc 5", Creator="User 5", Created=DateTime.Now, Updater="User 5", Updated=DateTime.Now},
new BusinessUnit{ Id=6, Name="BU 6", Description="Desc 6", Creator="User 6", Created=DateTime.Now, Updater="User 6", Updated=DateTime.Now},
new BusinessUnit{ Id=7, Name="BU 7", Description="Desc 7", Creator="User 7", Created=DateTime.Now, Updater="User 7", Updated=DateTime.Now},
new BusinessUnit{ Id=8, Name="BU 8", Description="Desc 8", Creator="User 8", Created=DateTime.Now, Updater="User 8", Updated=DateTime.Now},
new BusinessUnit{ Id=9, Name="BU 9", Description="Desc 9", Creator="User 9", Created=DateTime.Now, Updater="User 9", Updated=DateTime.Now},
};
foreach (object item in myList)
{
cmbBusinessUnits.Items.Add(item);
}
cmbBusinessUnits.SelectedIndex = 0;
}
Now here comes the Button Click event handler which will differentiate between Default Selection and Other items.
private void btnSearch_Click(object sender, RoutedEventArgs e)
{
if (this.cmbBusinessUnits.SelectedItem != null && !cmbBusinessUnits.SelectionBoxItem.Equals("All"))
{
txtSelected.Text = ((BusinessUnit)this.cmbBusinessUnits.SelectedItem).Name;
}
else
{
txtSelected.Text = string.Empty;
}
}
Now go ahead and run the application.
When you select other items the TextBlock would say which item you have choosen.
That's it. You can use this concept in as per your requirement.
Hope this article helps.