ComboBox with ItemTemplate and SelectionItemTemplate not displaying

[Francis]

Hi,

I have a RadComboBox that is as follows;

<telerik:RadComboBox ItemsSource="{Binding LevelOfActivityList}" SelectedItem="{Binding SelectedLevelOfActivity,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" MinWidth="200">
                                <telerik:RadComboBox.ItemTemplate>
                                    <DataTemplate>
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition/>
                                                    <RowDefinition/>
                                                </Grid.RowDefinitions>
                                                <TextBlock Grid.Row="0" Margin="3,0,0,0" HorizontalAlignment="Left" Text="{Binding Level,Mode=TwoWay}" FontWeight="Bold" />
                                                <TextBlock Grid.Row="1" Margin="3,0,0,0" HorizontalAlignment="Left" Text="{Binding Detail,Mode=TwoWay}" />
                                            </Grid>
                                    </DataTemplate>
                                </telerik:RadComboBox.ItemTemplate>
                                <telerik:RadComboBox.SelectionBoxTemplate>
                                    <DataTemplate>
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition />
                                                    <RowDefinition />
                                                </Grid.RowDefinitions>
                                                <TextBlock Grid.Row="0" Margin="3,0,0,0" HorizontalAlignment="Left" Text="{Binding Level, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" FontWeight="Bold" />
                                            </Grid>
                                    </DataTemplate>
                                </telerik:RadComboBox.SelectionBoxTemplate>
                            </telerik:RadComboBox>

The LevelOfActivity object is a list that has two properties Level and detail. When I run the application I can select the level of activity okay and its just the level that is displayed on the combobox once I select, that is how I want it to work. My problem is when I set the level of activity from the viewmodel (am using MVVM), i.e SelectedLevelOfActivity.Level, the combobox remains blank, nothing is displayed. I am using RadControls for Silverlight Q1 2012. What am I doing wrong? How do I get the combobox to display what I set in the viewmodel? I have tried setting the IsEditable property to true, setting the TextSearch.TextPath and all but still have not got it to work. Please provide any and all the help you can I need to solve this.

Francis. 

[Francis]

Hi,

Figured out a solution, implementing the IEquatable on my class solves the problem. below is the code sample for the benefit of any other person who might run into this problem. This works in an MVVM scenario, for code behind, I think this should work  http://www.telerik.com/community/forums/silverlight/combobox/selecteditem-not-in-itemssource.aspx#1969879 .


THE CLASS
public class TestModel : INotifyPropertyChanged, IEquatable<TestModel>
    {


        #region Properties


        private string _item1;
        public string Item1
        {
            get { return _item1; }
            set
            {
                _item1 = value;
                OnPropertyChanged("Item1");
            }
        }


        private string _detail;
        public string Detail
        {
            get { return _detail; }
            set
            {
                _detail = value;
                OnPropertyChanged("Detail");
            }
        }


        #endregion


        #region NotifyPropertyChanged


        public event PropertyChangedEventHandler PropertyChanged;
        public void OnPropertyChanged(string propertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }


        #endregion


        #region IEquatable


        public override string ToString()
        {
            return Item1;
        }


        public bool Equals(TestModel other)
        {
            if (ReferenceEquals(null, other)) return false;
            if (ReferenceEquals(this, other)) return true;
            return Equals(other.Item1, Item1) && Equals(other.Detail, Detail);
        }


        public override bool Equals(object obj)
        {
            if (ReferenceEquals(null, obj)) return false;
            if (ReferenceEquals(this, obj)) return true;
            if (obj.GetType() != typeof(TestModel)) return false;
            return Equals((TestModel)obj);
        }


        public override int GetHashCode()
        {
            int result = Item1.GetHashCode();
            result = (result*397) ^ (Detail != null ? Detail.GetHashCode() : 0);
            return result;
        }


        public static bool operator == (TestModel left, TestModel right)
        {
            if (ReferenceEquals(left, null)) return false;
            return left.Equals(right);
        }


        public static bool operator !=(TestModel left,TestModel right)
        {
            return !(left == right);
        }


        #endregion
    }

THE XAML for the ComboBox.

<telerik:RadComboBox ItemsSource="{Binding TestModelList}" SelectedItem="{Binding SelectedTestModel,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" MinWidth="200"
                                                 Text="{Binding SelectedTestModel.Item1, Mode=TwoWay}">
                                <telerik:RadComboBox.ItemTemplate>
                                    <DataTemplate>
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition/>
                                                    <RowDefinition/>
                                                </Grid.RowDefinitions>
                                                <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="3,0,0,0" HorizontalAlignment="Left">
                                                    <TextBlock HorizontalAlignment="Left" Text="{Binding Item1,Mode=TwoWay}" FontWeight="Bold"/>
                                                </StackPanel>
                                                <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="3,0,0,0" HorizontalAlignment="Left" >
                                                    <Border BorderThickness="2" CornerRadius="10" Background="Azure">
                                                        <TextBlock Text="{Binding Detail,Mode=TwoWay}" MinWidth="200" />
                                                    </Border>
                                                </StackPanel>
                                            </Grid>
                                    </DataTemplate>
                                </telerik:RadComboBox.ItemTemplate>
                                <telerik:RadComboBox.SelectionBoxTemplate>
                                    <DataTemplate>
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition />
                                                    <RowDefinition />
                                                </Grid.RowDefinitions>
                                                <StackPanel Grid.Row="0" Margin="3,0,0,0" HorizontalAlignment="Left">
                                                    <TextBlock Text="{Binding Item1, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" FontWeight="Bold" />
                                                </StackPanel>
                                            </Grid>
                                    </DataTemplate>
                                </telerik:RadComboBox.SelectionBoxTemplate>
                            </telerik:RadComboBox>


The viewmodel is easy to setup for anyone with some MVVM knowledge. But that about solves the problem in an MVVM scenario.

Thanks,


Francis.