[Solved] GridViewComboBoxColumn EditorStyle

[Tamiko]

I followed the code found in the following link, however both columns still display when the an item is selected.  Also below is my code.  Any ideas would be most appreciated.

http://www.telerik.com/community/forums/silverlight/gridview/obtain-the-same-behavior-as-selectionboxtemplate-radcombobox-in-a-gridviewcomboboxcolumn.aspx

.cs - Create column

GridViewComboBoxColumn colBodyPkgType = new GridViewComboBoxColumn();
                colBodyPkgType.Header = "Pkg Type";
                colBodyPkgType.UniqueName = "Pkg Type";
                colBodyPkgType.DataMemberBinding = new Binding("PkgType");
                colBodyPkgType.DataMemberBinding.Mode = BindingMode.TwoWay;
                colBodyPkgType.SelectedValueMemberPath = "PKG_Code";
                colBodyPkgType.DisplayMemberPath = "PKG_Code";//or PKG_Desc ????
                colBodyPkgType.EditorStyle = (Style)this.Resources["pkgTypeStyle"];

.xaml

 

 

 

 

<Style x:Key="pkgTypeStyle" TargetType="telerikInput:RadComboBox">
            <Setter Property="ItemTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <StackPanel Margin="2" Orientation="Horizontal">
                            <TextBlock HorizontalAlignment="Left" Text="{Binding PKG_Code}" Width="75" />
                            <TextBlock HorizontalAlignment="Left" Text="{Binding PKG_Desc}" Width="225" />
                        </StackPanel>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>

[Maya]

Hi Tamiko,

Basically, once you click on the cell and the RadComboBox is displayed in the GridViewComboBoxColumn, it goes into edit mode and the editor style is applied. That is why the ItemTemplate you defined will be visualized before the RadComboBox drop downs.
What you may try is to set one additional property to the style of the combo box:

<Style x:Key="MyStyle" TargetType="telerik:RadComboBox">
        <Setter Property="ItemTemplate">
            ....
        </Setter>
        <Setter Property="OpenDropDownOnFocus" Value="True" />
    </Style>

And set the EditTriggers property of the column:

<telerik:GridViewComboBoxColumn Header="Nationality"
                                                EditTriggers="CellClick"
                                                UniqueName="Nationality"
                                                EditorStyle="{StaticResource MyStyle}"
                                                DataMemberBinding="{Binding CountryID, Mode=TwoWay}"
                                                DisplayMemberPath="Name"
                                                SelectedValueMemberPath="ID">

Thus once you click on the cell, the drop down will be opened.  

All the best,
Maya
the Telerik team

[Tamiko]

My apologies, I wasn't clear. I need both fields in the dropdown, but only the PKG_Code to display once the item is selected.

[Maya]

Hello Tamiko,

In order to provide you with an accurate solution, I would need just a bit more information. As it is in the example in the forum thread, the displayed value in view-mode is only - Name. In edit mode both values are displayed - ID and Name. What do you want to see in edit mode and what in view-mode ?
  

Regards,
Maya
the Telerik team

[Tamiko]

In editmode (dropdown open), I need to see PKG_Code and PKG_Desc.  In viewmode (dropdown closed), I need to see only PKG_Code.

[Maya]

Hi Tamiko,

I am getting a bit confused here - the sample attached in the forum thread you mentioned illustrates just that - in view mode only Name, in edit mode - Name and ID. May you take a look at this small video illustrating the behavior I get ? What is the difference according to your requirements ?  

Regards,
Maya
the Telerik team

[Tamiko]

Very close.  Once the item is selected and the dropdown is closed the end-user should only see the ID column.  In your video both columns are appear, until a new row is selected. 

[Maya]

Hello Tamiko,

That would be expected since the cell is in edit mode till it loses its focus. What you may try is to handle the SelectionChanged event of the RadComboBox and call CommitEdit() once a value has been selected:

this.AddHandler(RadComboBox.SelectionChangedEvent, new Telerik.Windows.Controls.SelectionChangedEventHandler(OnSelectionChanged));

private void OnSelectionChanged(object sender, Telerik.Windows.Controls.SelectionChangedEventArgs e)
{
            if(e.RemovedItems.Count > 0)
            {
                this.RadGridView1.CommitEdit();
            }
}

 

Greetings,
Maya
the Telerik team

[Tamiko]

The following line generates and error, " No overload for method Add Handler" takes 2 arguements.

this.AddHandler(RadComboBox.SelectionChangedEvent, new Telerik.Windows.Controls.SelectionChangedEventHandler(OnSelectionChanged));


What's really frustrating is that if I create the column in the following manner in xaml everything works the way I expect it to work. My preference is to use codebehind and the GridViewComboBoxColumn.

<telerikGridView:GridViewDataColumn Header="Pkg Type" HeaderTextAlignment="Center" DataMemberBinding="{Binding PkgType, Mode=TwoWay}" Width="65" >
                    <telerikGridView:GridViewDataColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding PkgType}" />
                        </DataTemplate>
                    </telerikGridView:GridViewDataColumn.CellTemplate>
                    <telerikGridView:GridViewDataColumn.CellEditTemplate>
                        <DataTemplate>
                            <telerikInput:RadComboBox x:Name="rcboPkgType" ItemsSource="{StaticResource PkgTypes}"      DropDownOpened="rcboPkgType_DropDownOpened" IsEditable="True" SelectedValuePath="PKG_Code"
                                    telerik:TextSearch.TextPath="PKG_Code" SelectedValue="{Binding PkgType, Mode=TwoWay}" MaxDropDownHeight="100">
                                <telerikInput:RadComboBox.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Margin="2" Orientation="Horizontal">
                                            <TextBlock HorizontalAlignment="Left" Text="{Binding PKG_Code}" Width="75" />
                                            <TextBlock HorizontalAlignment="Left" Text="{Binding PKG_Desc}" Width="225" />
                                        </StackPanel>
                                    </DataTemplate>
                                </telerikInput:RadComboBox.ItemTemplate>
                            </telerikInput:RadComboBox>
                        </DataTemplate>
                    </telerikGridView:GridViewDataColumn.CellEditTemplate>
                </telerikGridView:GridViewDataColumn>

[Maya]

Hello Tamiko,

I am sending you the sample project I used for testing the case. May you take a look at it and let me know whether you are able to get the same behavior as the one you experience on your application ?
 

Greetings,
Maya
the Telerik team

[Tamiko]

The images, griddatacolumwithradcombobox.png and griddatacolumwithradcomboboxclosed.png shows the behavior generated by the code sent in my previous post. When the dropdown is open both columns are displayed and once the selection is made and the dropdown closes only the "DisplayMemberPath" value is shown. 

The sample, unfortunately is same code discussed in thread mentioned in my first post.  Both columns are still displayed when the selection is made and the dropdown closes, as shown in the third image, gridcombo.png.  The second column only disappears once commitedit is called.  I would really like to understand why the behaviors are so different. 

I really wanted to have the same behavior displayed in griddatacolumwithradcombobox.png and griddatacolumwithradcomboboxclosed.png, with the GridViewComboBoxColumn, but that does not seem possible, so I will use the code posted in my last post.

[Maya]

Hi Tamiko,

Based on the suggestions made before, I have prepared a sample project. In it, once you select a value from the combo box column, the changes are committed and only one of the values are displayed. May you take a look at it and let me know whether this will fit into your requirements.
 

Regards,
Maya
the Telerik team

[Tamiko]

Very close.  Two issues, however, the "ID" column should only appear in the dropdown and never in the "textbox" of the combobox.  Second issue, I still recieve the following error on the AddHandler method, " No overload for method Add Handler" takes 2 arguements.  This may be a version issue,  I am working with version 2010.3.1110.1040 of the RadControls and upgrading at this point is not an option. Seems I am missing a the following class, DependencyObjectExtension, in the Telerik.Windows namespace.

I'll stick with the code I posted on 7/27/2011.

Thanks for your efforts.

[Maya]

Hello Tamiko,

Please take a look at the image attached. Is the ID in number "1" on the image the place you do not want this ID to be displayed ? In the image all items are a part of the CellEditTemplate (RadComboBox), not the CellTemplate (TextBlock).
Considering the second issue, you need to use the "Telerik.Windows.Controls.SelectionChangedEventHandler", not "

System.Windows.Controls.SelectionChangedEventHandler 

" May you verify which one are you using in your application ?

 

Greetings,
Maya
the Telerik team

[Tamiko]

Issue 1: Is the ID in number "1" on the image the place you do not want this ID to be displayed ? Yes.

Issue 2:  Not certain if I understand what you are asking, however below is the line that generates the error.  Is there something wrong with the way I am trying to add the event?
this.AddHandler(RadComboBox.SelectionChangedEvent, new Telerik.Windows.Controls.SelectionChangedEventHandler(OnSelectionChanged));

[Maya]

Hello Tamiko,

You can set the GridViewComboBoxColumn editable:

<telerik:GridViewComboBoxColumn DataMemberBinding="{Binding ClubID}"
                                                IsComboBoxEditable="True"
                                                ItemsSource="{Binding Clubs, Source={StaticResource MyViewModel}}"
                                                SelectedValueMemberPath="ID"
                                                DisplayMemberPath="Name" >

 
In this case the editor of the RadComboBox (which is in fact the editor of the GridViewComboBoxColumn) will be a TextBox, while the ItemTemplate will be applied to all the other items inside.
Considering the second issue, I was referring to which event handler you are using - the one in the Telerik.Windows.Controls assembly or in System.Windows.Controls. Based on code provided, you created the first one - this is the correct one for Silverlight. May you reproduce the behavior on the sample I previously attached ? May you try to use the other overload constructor that takes three parameter - you can set "true" as the last one ? Do you continue to get the exception ? You may take a look at this article for a reference on how to add handlers.

Best wishes,
Maya
the Telerik team

[Tamiko]

Issue 2:  Again I believe this is a version issue.  

            May you reproduce the behavior on the sample I previously attached ?  I cannot reproduce the behaviour in the sample.
            May you try to use the other overload constructor that takes three parameter - you can set "true" as the last one ?  
                    

            AddHandler(

RadComboBox.SelectionChangedEvent, new Telerik.Windows.Controls.SelectionChangedEventHandler(OnSelectionChanged),true);

 

        Generates the following error:  "The best overloaded method match for 'System.Window.UIElement.AddHandler(System.Window.routedEvent, System.Delegate,boo)' has some invalid arguements."

The version of the RadControls that I am using does not contain the Telerik overloaded methods for AddHandler.

I'll stick with the code I posted on 7/27/2011.  No need to continue troubleshooting this issue.

Thanks for your efforts.

[Maya]

Hello Tamiko,

Generally, AddHandler() is not a method of the RadControls, but one provided by the Framework. Anyway, I am glad that you still have a solution for your issue.
Let me know in case you need any further assistance.

 

All the best,
Maya
the Telerik team

[Tamiko]

Yes, the AddHandler method is a method provided by the Framework, however the version of Telerik.Windows.Controls.dll, v2.0.50727 used in your sample contains an extension to the AddHandler method.