ComboBox in CellTemplateSelector not showing properly

9 posts, 1 answers
  1. Pete
    Pete avatar
    10 posts
    Member since:
    Sep 2011

    Posted 11 Oct 2011 Link to this post

    I want to implement:

    If ID ==0 , in the Region column, the control should be comboBox. So that I can select from a list.

    if ID != 0, in the Region column, the control should be TextBlock.

     

    I used templateSelector and DataTemplate. The TextBlock controls work fine. But for some reason, the ComboBox doesn't work.

     

    <telerik:RadGridView.Columns>

        <telerik:GridViewColumn CellTemplateSelector="{StaticResource commandCellSelector}" Width="110"/>

        <telerik:GridViewDataColumn DataMemberBinding="{Binding RegionName, Mode=TwoWay}" Header="Region" Width="180" CellTemplateSelector="{StaticResource regionCellSelector}"/>

        <telerik:GridViewDataColumn DataMemberBinding="{Binding DivisionName, Mode=TwoWay}" Header="Division" Width="180"/>

        <telerik:GridViewDataColumn DataMemberBinding="{Binding SubDivisionName, Mode=TwoWay}" Header="SubDivision" Width="180"/>

    </telerik:RadGridView.Columns>

     

    <DataTemplate x:Key="RegionEditTemplate">

        <TextBlock Text="{Binding RegionName, Mode=TwoWay}" />

    </DataTemplate>

    <DataTemplate x:Key="RegionAddNewTemplate">

        <ComboBox ItemsSource="{Binding RegionSearchList, Source={StaticResource ViewModel}}"DisplayMemberPath="Name" SelectedValuePath="ID" SelectedValue="{Binding RegionID}"/>

    </DataTemplate>

    <templateSelector:ManageWorkAreaRegionSelector x:Name="regionCellSelector" RegionEditTemplate="{StaticResource RegionEditTemplate}" RegionAddNewTemplate="{StaticResource RegionAddNewTemplate}"/>

     

  2. Vlad
    Admin
    Vlad avatar
    11100 posts

    Posted 12 Oct 2011 Link to this post

    Hi,

     Can you clarify what exactly is not working?

    All the best,
    Vlad
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. Pete
    Pete avatar
    10 posts
    Member since:
    Sep 2011

    Posted 13 Oct 2011 Link to this post

    Here is the problems:

    1. There is no Edit Mode for this ComboBox.
         As usual, we need to click twice to go to the edit mode in the GridView, while when I implement DataTemplate, there is no edit mode.

    2. There is a gap between Grid line and ComboBox. If I click the gap, the comboBox disappears and I enter a textBox. I can edit in this textBox. But I don't want this gap(You can see the blue box in the image attached).

     

  4. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 14 Oct 2011 Link to this post

    Hello Pierre-Luc ,

    Generally, RadComboBox is not editable. You could set its IsEditable property to "True" if you want to be able to be capable of typing in it. Please take a look at our online documentation for a reference. Is that the functionality you require ? 
    If you want to remove the gap you are referring to, you could edit the style of the corresponding cell and predefine its Margin property. For example:

    <UserControl.Resources>
            <Style x:Key="myStyle" TargetType="telerik:GridViewCell">
                <Setter Property="Margin" Value="-5,0,0,0" />
            </Style>
        </UserControl.Resources>
     
    <telerik:GridViewDataColumn CellStyle="{StaticResource myStyle}">
                        <telerik:GridViewDataColumn.CellTemplate>
                            <DataTemplate>
                                <telerik:RadComboBox />
                            </DataTemplate>
                        </telerik:GridViewDataColumn.CellTemplate>
                    </telerik:GridViewDataColumn>

    You can play along with the values of the Margin so that it looks exactly as you want it.
    Let me know whether those solutions will correspond to your requirements.
     

    All the best,
    Maya
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  5. Pete
    Pete avatar
    10 posts
    Member since:
    Sep 2011

    Posted 18 Oct 2011 Link to this post

    Hi,

    Thank you for you reply. Edit mode I mentioned is not to set RadComboBox to editable. What I mean here is if I use GridViewComboBoxColumn, in order to select a value from comboBox, I need to click twice. I want it to be consistent, so if I use DataTemplate, how can I click twice to select value instead of click once.


    Thanks

  6. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 18 Oct 2011 Link to this post

    Hi Pierre-Luc ,

    You could try to set the GridViewComboBoxColumn to be edited on one click instead. What you can do is:

    <telerik:GridViewComboBoxColumn DataMemberBinding="{Binding ClubID}"
                                                SelectedValueMemberPath="ID"
                                                EditTriggers="CellClick"
                                                DisplayMemberPath="Name"
                                                ItemsSource="{Binding Clubs, Source={StaticResource MyViewModel}}">
                    <telerik:GridViewComboBoxColumn.EditorStyle>
                        <Style TargetType="telerik:RadComboBox">
                            <Setter Property="OpenDropDownOnFocus" Value="True" />
                        </Style>
                    </telerik:GridViewComboBoxColumn.EditorStyle>
                </telerik:GridViewComboBoxColumn>

    Will that approach suit your needs ? 

    Regards,
    Maya
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  7. Pete
    Pete avatar
    10 posts
    Member since:
    Sep 2011

    Posted 20 Oct 2011 Link to this post

    There are other issues.

    1. The gaps are not only on the left side. They are left, up, right, down sides. If I use margin like (-5,-5,-5,-5), the "Required" message icon on the right top corner is hidden by the ComboBox. I want "Required" message shows up if ComboBox is not selected. Please check the image.

    If I use GridViewComboBoxColumn, there is "required message" showing on the GridViewComboBoxColumn . Can I have exactly same behaviour like GridViewComboBoxColumn here?

    (The reason I don't use GridViewComboBoxColumn here is because I want to implement: if ID > 0, the cell will be TextBox. if ID == 0, the cell will be ComboBox. so I choose GridViewDataColumn.)


    2. On this ComboBox, I want to click twice to enter the edit model exactly like before.

  8. Answer
    Maya
    Admin
    Maya avatar
    4062 posts

    Posted 25 Oct 2011 Link to this post

    Hello Pierre-Luc ,

    The error message will be displayed on validating the value after editing it. In your case the cell does not go into edit mode - you just edit the value through the combo box, which is used for the CellTemplate, not CellEditTemplate. What you can do is to handle the validation in the setter of the corresponding property or during the SelectionChanged event for example. 
    Do you want to display the RadComboBox in view-mode or setting it on editing the value will be appropriate ? As in this case you can use CellEditTemplateSelector, you will not have problems with validating the values and the margins will be sized properly.
    Please let me know what if using CellEditTempalteSelector will suit your needs or in case you need any further assistance.
     

    Regards,
    Maya
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  9. Pete
    Pete avatar
    10 posts
    Member since:
    Sep 2011

    Posted 25 Oct 2011 Link to this post

    Hi Maya,

    Thank you for your carefulness and patience. CellEditTemplateSelector is exactly what I want.
    Thanks a lot.
Back to Top