How to collapse an item in a GridViewComboBoxColumn

[Inger Marie]

What I really want to do is this:

I am changing a free-text-field to a categorized field. The categories are objects of a custom class, that I made (ie not a string). I do not want to force my users to select a category on old objects. However, if they want to give a category, they must not be able to select null (also, new objects has null as the SelectedCategory). So I have the old string property and a new SelectedCategory property on my class. On old object SelectedCategory is null - which is good.

However in GridViewComboBoxColumn - since I do have null in the ItemsSource, the first category in the ItemsSource gets selected automatically when the ViewModel provides null as the selected category to the column.

So I try to bypass this behaviour by inserting null in ItemsSource - but then I need to Collapse the item with the value null so that it becomes invisible to the user.

But there are no GridViewComboBoxColumn.ItemsStyle

How do I do this?

 

I do not want to make a validation rule - because I do not want the old objects without a selected category to flash red.

I do not want to have the null value on the userinterface for the user to select and then give him an error that he cannot select it anyway.

 

[Stefan]

Hello Inger Marie,

As there is no built-in functionality for such customization, I can suggest you the following approach for implementing it by yourself. Before populating GridViewComboBoxColumn with items, you can simply call the RemoveAt() method on the collection that would be used as an ItemsSource of GridViewComboBoxColumn. If you further need to have that null value again in the collection, you can insert it back via the Insert() method.

Let me know if you need any further assistance.

Best Regards,
Stefan
Telerik

[Inger Marie]

This solution does not work, because I have several items in the grid - and I only want to hide the null-selection for the items, where the category has been set.

Item1: Id=1, CategoryId = null

Item2: Id=2, CategoryId = 4

Item3: Id=3, CategoryId = null

Then I want GridViewComboBoxColumn to allow null for Item 1 and Item 3, but not for Item 2. Hence, I do not want to actually remove null from the ItemsSource, but rather hide it for Item2.

I tried to do it by adding a Editor Style like this:

        <telerik:GridViewComboBoxColumn.EditorStyle>
                        <Style TargetType="telerik:RadComboBox">
                            <Setter Property="ItemContainerStyle">
                                <Setter.Value>
                                    <Style TargetType="{x:Type telerik:RadComboBoxItem}" >
                                        <Setter Property="Visibility" Value="{Binding Converter={StaticResource Null2Collapsed}}" />
                                    </Style>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </telerik:GridViewComboBoxColumn.EditorStyle> 

 

but I get a "Key may not be null"-exception, which I believe originate from the invisible item when changing away from Null to a real value. At least it happens when I try to change the value from Null to something else.

[Inger Marie]

This seems to work (I have used fake names to simplyfy it, so there may be typo's in it):

       <telerik:GridViewComboBoxColumn x:Name="_colCategory" Header="Category"
                                    ToolTip="Category"
                                    ToolTipService.ShowOnDisabled="True"
                                    Width="40"
                                    ItemsSource="{Binding Categories}"
                                    DataMemberBinding="{Binding Category}" TextAlignment="Right"
                                    GroupMemberPath="Category"
                                    SortMemberPath="Category.Name" >
                    <telerik:GridViewComboBoxColumn.EditorStyle>
                        <Style TargetType="telerik:RadComboBox">
                            <Setter Property="OpenDropDownOnFocus" Value="true" />
                            <Setter Property="SelectionBoxTemplate">
                                <Setter.Value>
                                    <DataTemplate DataType="{x:Type Category}">
                                        <TextBlock Text="{Binding Path=Name}" />
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="ItemContainerStyle">
                                <Setter.Value>
                                    <Style TargetType="{x:Type telerik:RadComboBoxItem}" >
                                        <Setter Property="Visibility" Value="{Binding Path=., Converter={StaticResource Null2Collapsed}}" />
                                    </Style>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </telerik:GridViewComboBoxColumn.EditorStyle>
                    <telerik:GridViewComboBoxColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Path=Category.Name}" Visibility="{Binding Path=., Converter={StaticResource Null2Collapsed}}" />
                        </DataTemplate>
                    </telerik:GridViewComboBoxColumn.CellTemplate>
                    <telerik:GridViewComboBoxColumn.ItemTemplate>
                        <DataTemplate DataType="{x:Type Category}">
                            <TextBlock Text="{Binding Path=., Converter={StaticResource CategoryConverter}}" Visibility="{Binding Path=., Converter={StaticResource Null2Collapsed}}" />
                        </DataTemplate>
                    </telerik:GridViewComboBoxColumn.ItemTemplate>
                    <telerik:GridViewComboBoxColumn.GroupHeaderTemplate>
                        <DataTemplate DataType="{x:Type telerik:GroupViewModel}">
                            <TextBlock  Text="{Binding  Path=Group.Key, Mode=OneWay, Converter={StaticResource CategoryConverter}}"/>
                        </DataTemplate>
                    </telerik:GridViewComboBoxColumn.GroupHeaderTemplate>
                </telerik:GridViewComboBoxColumn>

[Stefan]

Hello Inger Marie,

I am glad you found a resolution for your scenario.

Do not hesitate to contact us should you have any other questions on our controls.

Best Regards,
Stefan
Telerik