Silverlight GridViewComboBoxColumn Binding Commands with MVVM Not working

3 posts, 0 answers
  1. Matt
    Matt avatar
    2 posts
    Member since:
    Dec 2011

    Posted 19 Dec 2011 Link to this post

    I am trying to run a command from a GridViewColumn, and the RadGridView is bound to my ViewModel.  The code below runs the command, but when I select a value from the ComboBox, it saves the row immediately without allowing me to make changes to other cells first.  This behavior happens whether or not I have the command bound to the RADComboBox.  If I take the command away, still happens.

    XAML:
    <telerik:RadGridView x:Name="GV1"
                                     ItemsSource="{Binding Path=Material}"
                                     AutoGenerateColumns="False"
                                     IsReadOnly="{Binding IsGridReadOnly}"
                                                  ShowGroupPanel="False"
                                     VerticalAlignment="Top"
                                     HorizontalAlignment="Center"
                                    RowDetailsVisibilityMode="VisibleWhenSelected">
               <i:Interaction.Triggers>
                  <i:EventTrigger EventName="RowEditEnded">
                        <cmd:EventToCommand Command="{Binding RowEditEndedCommand}"
                                                          PassEventArgsToCommand="True" />
                  </i:EventTrigger>
                     <i:EventTrigger EventName="CancelRowEdit">
                        <cmd:EventToCommand Command="{Binding CancelEditCommand}" />
                     </i:EventTrigger>
                  </i:Interaction.Triggers>
        <telerik:RadGridView.Columns>
        <telerik:GridViewColumn Header="Material Code">
                        <telerik:GridViewColumn.CellEditTemplate>
                           <DataTemplate>
                              <telerik:RadComboBox ItemsSource="{Binding DataSource.AllMaterials, Source={StaticResource DCP}}"
                                                      DisplayMemberPath="Code"
                                                      SelectedValuePath="Code"
                                                      SelectedValue="{Binding Path=MaterialCode, Mode=TwoWay}"
                                                      IsEnabled="{Binding Path=IsMaterialEditable, Mode=TwoWay}"
                                                      Command="{Binding DataSource.MaterialCodeChangedCommand, Source={StaticResource DCP}}"/>
                           </DataTemplate>
                           </telerik:GridViewColumn.CellEditTemplate>
                        <telerik:GridViewColumn.CellTemplate>
                           <DataTemplate>
                              <TextBlock Text="{Binding MaterialCode}" />
                           </DataTemplate>
                        </telerik:GridViewColumn.CellTemplate>
                     </telerik:GridViewColumn>
            <!--7 Other Columns here-->
        </telerik:RadGridView.Columns>
            </telerik:RadGridView>

    Code
    public RelayCommand MaterialCodeChangedCommand { get; private set; }
        //IN Constructor
        this.MaterialTypeChangedCommand = new RelayCommand(MaterialTypeChange);
      
        private void MaterialCodeChange()
          {
             //Command code here
          }

    When I take the ComboBox out of the CellEditTemplate and try to use the GridViewComboBox, I can't figure out how to get the binding to work, but it doesn't fire off the RowEditEnded just by selecting the drop down so that part work correctly with this code:

       
    <telerik:GridViewComboBoxColumn Header="Material Type"
                                                          ItemsSource="{Binding DataSource.AllTypeCodes, Source={StaticResource DCP}}"
                                                          SelectedValueMemberPath="Code"
                                                          DataMemberBinding="{Binding Path=MaterialType, Mode=TwoWay}"
                                                          DisplayMemberPath="Display">
                            <i:Interaction.Triggers>
                               <i:EventTrigger EventName="SelectionChanged">
                                  <i:InvokeCommandAction Command="{Binding DataSource.MaterialTypeChangedCommand, Source={StaticResource DCP}}"/>
                               </i:EventTrigger>
                            </i:Interaction.Triggers>
                         </telerik:GridViewComboBoxColumn>


    If this is unclear let me know, it's late and I may not be clear.  Thanks for any help you can offer.  I should note that the RowEditEnded acts like this on other drop downs in my application as well when set up in the CellEditTemplate.  Converting to the to the GridViewComboBoxCOlumn resolves that but then the binding issue...
  2. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 21 Dec 2011 Link to this post

    Hi Matt,

    Actually, you cannot add an event trigger for SelectionChanged event, as the column itself does not have one. Furthermore, RadGridView does not have CancelRowEdit - do you extend the functionality of the grid in some manner ? Why do you want to handle SelectionChanged event of RadComboBox ? What is the exact problem when you are working with GridViewComboBoxColumn - are you incapable of binding it properly ? 
     
    Greetings,
    Maya
    the Telerik team

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

  3. Matt
    Matt avatar
    2 posts
    Member since:
    Dec 2011

    Posted 21 Dec 2011 Link to this post

    Maya,
    Thanks for your response.  What I have been trying to do is bind 2 combo boxes together, so if I select a value from one, it will adjust the selection in another, and vice versa.  I have had it set up like this:

    <telerik:GridViewColumn Header="Material Code">
                        <telerik:GridViewColumn.CellEditTemplate>
                           <DataTemplate>
                              <telerik:RadComboBox ItemsSource="{Binding DataSource.AllMaterials, Source={StaticResource DCP}}"
                                                      DisplayMemberPath="Code"
                                                      SelectedValuePath="Code"
                                                      SelectedValue="{Binding Path=MaterialCode, Mode=TwoWay}"
                                                      IsEnabled="{Binding Path=IsMaterialEditable, Mode=TwoWay}"
                                                      Command="{Binding DataSource.MaterialCodeChangedCommand, Source={StaticResource DCP}}"/>
                           </DataTemplate>
                           </telerik:GridViewColumn.CellEditTemplate>
                        <telerik:GridViewColumn.CellTemplate>
                           <DataTemplate>
                              <TextBlock Text="{Binding MaterialCode}" />
                           </DataTemplate>
                        </telerik:GridViewColumn.CellTemplate>
                     </telerik:GridViewColumn>

    In my ViewModel I use RelayCommand to make the changes.  Whether the Command in the GridViewColumn or not, when I select the drop down list, just click on it to go from CellTemplate Textblock to CellEditTemplate drop down, it fires off the EditEnded command and saves the row, even though I haven't left the row.  Is there something in the RadComboBox, when it is selected, that moves the focus from the row and causes it to think the edit is done?

    If I use the GridViewComboBoxColumn instead, the EditEnded doesn't fire when I enter the ComboBox, meaning it works correctly, but I lose the ability to set a Command like I can on the RadComboBox inside of a GridViewColumn.

    So my problem is that I either need to figure out how to prevent the RowEditEnded from firing when selecting the RadComboBox in CellEditTemplare OR get the GridViewComboBoxColumn to accept a command back to my ViewModel.

    Thanks,

    Matt
Back to Top