Combobox binding with different types
- by George Evjen
Binding to comboboxes in Silverlight has been an adventure the past couple of days. In our framework at ArchitectNow we use LookupGroups and LookupValues. In our database we would have a LookupGroup of NBA Teams for example. The group would be called NBATeams, we get the LookupGroupID and then get the values from the LookupValues table. So we would end up with a list of all 30+ teams. Our lookup values entity has a display text(string), value(string), IsActive and some other fields. With our applications we load all this information into the system when the user is logging in or right after they login. So in cache we have a list of groups and values that we can get at whenever we want to. We get this information in our framework simply by creating an observable collection of type LookupValue. To get a list of these values into our property all we have to do is. var NBATeams = AppContext.Current.LookupSerivce.GetLookupValues(“NBATeams”); Our combobox then is bound like this. (We use telerik components in most if not all our projects) <telerik:RadComboBox ItemsSource="{Binding NBATeams}”></telerik:RadComboBox>
This should give you a list in your combobox.
We also set up another property in our ViewModel that is a just single object of NBATeams - “SelectedNBATeam”
Our selectedItem in our combobox would look like, we would set this to a two way binding since we are sending data back.
SelectedItem={Binding SelectedNBATeam, mode=TwoWay}”
This is all pretty straight forward and we use this pattern throughout all our applications. What do you do though when you have a combobox in a ItemsControl or ListBox? Here we have a list of NBA Teams that are a string that are being brought back from the database. We cant have the selected item be our LookupValue because the data is a string and its being bound in an ItemsControl. In the example above we would just have the combobox in a form. Here though we have it in a ItemsControl, where there is no selected item from the initial ItemsSource.
In order to get the selected item to be displayed in the combobox you have to convert the LookupValue to a string. Then instead of using SelectedItem in the combobox use SelectedValue.
To convert the LookupValue we do this.
Create an observable collection of strings
public ObservableCollection<string> NBATeams { get; set;}
Then convert your lookups to strings
var NBATeams = new ObservableCollection<string>(AppContext.Current.LookupService.GetLookupValues(“NBATeams”).Select(x => x.DisplayText));
This will give us a list of strings and our selected value should be bound to the NBATeams property in our ItemsSource in our ItemsControl.
SelectedValue={Binding NBATeam, mode=TwoWay}”