Is it possible to drag a row without selecting it?

[Kjell]

Hello,

I have a gridview with ~10 columns which contains various controls.  Below the grid is a pane kind of like the outlook reading pane, so you select things in the grid and then the pane shows some data that corrosponds to the selected row.  I was asked to add the ability to drag rows onto the pane which would then cause them to merge.  So for example I have row 1 selected, row 1's details are shown in the pane, I want to drag row 3 down onto the pane and that causes the data to merge and row 3 will be deleted while row 1 now contains the merged data.  The problem is of course that as soon as I click on row 3 (selectionmode on the grid is set to single), it becomes the selected row instead of row 1, so essentially I can only merge a row with itself, which doesn't get me anywhere.  So I'v been asked, is it possible to have a certain part of the row (say a button or icon) used for dragging but clicking that area does not cause the row to be selected?  Right now if I click anywhere in the row, it becomes the selected row, and we don't want to lose that functionality but we would like to be able to click in a specific area and drag the row without it becoming selected, does that make sense?

To give a little more background, I initially used the rowreorder behavior and had it so you could drag and drop rows on top of each other which would merge them.  I was recently asked to change it so instead of dropping rows on in each other the user could drop a row on the preview pane.

[Maya]

Hi Kjell,

Generally, if you create a button inside the CellTemplate of a single column, clicking on it will not select the item itself. So, this might be a possible approach to take. Furthermore, you may try to handle the SelectionChanging event and cancel it when required.
Let me know if you need any further assistance.
 

Greetings,
Maya
the Telerik team

[Kjell]

Hi Maya, thank you for your response.

I have 3 buttons in my gridviewrows, as soon as the mousebutton is clicked down on any of the buttons (or anywhere else in the row), the row becomes selected.

I'v attached the XAML for the two columns which contain these buttons in case I am doing something wrong.

As for the selectionchanged event, in that event how can I tell which element in the row was clicked?


<telerik:GridViewDataColumn Header="" UniqueName="colDelete" >

    <telerik:GridViewDataColumn.CellStyle>

        <Style TargetType="telerik:GridViewCell">

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="telerik:GridViewCell">

                        <Border BorderBrush="DarkGray" BorderThickness="0,0,1,0" Background="Transparent" Name="brdDel" >

                            <StackPanel>

                                <telerik:RadButton Content="Delete" Name="btnDelRow" Click="btnDelRow_Click" IsEnabled="{Binding EnableRow}"

                    Margin="1,2,1,0" VerticalAlignment="Top" Width="45" Height="21" />

                            </StackPanel>

                        </Border>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

        </Style>

    </telerik:GridViewDataColumn.CellStyle>

</telerik:GridViewDataColumn>

  

<telerik:GridViewDataColumn Header="Actions" UniqueName="colActions" >

  

    <telerik:GridViewDataColumn.CellStyle>

        <Style TargetType="telerik:GridViewCell">

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="telerik:GridViewCell">

                        <Border BorderBrush="DarkGray" BorderThickness="0,0,1,0" Background="Transparent" Name="brdActions" >

                            <StackPanel Orientation="Horizontal">

                                <telerik:RadButton Content="Learn" Click="btnLearn_Click" IsEnabled="{Binding EnableRow}" 

                    VerticalAlignment="Top" Margin="1,2,0,0" Height="21" ClickMode="Release" />

                                <TextBlock Width="3" />

                                <telerik:RadButton Content="Block" Click="btnBlock_Click" IsEnabled="{Binding EnableRow}"

                    VerticalAlignment="Top" Margin="0,2,1,0" Height="21" />

                            </StackPanel>

                        </Border>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

        </Style>

    </telerik:GridViewDataColumn.CellStyle>

  

  

</telerik:GridViewDataColumn>

[Maya]

Hello Kjell,

The way to go is to define the CellTemplate of that particular column:

<telerik:GridViewDataColumn DataMemberBinding="{Binding Name}">
                        <telerik:GridViewDataColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <telerik:RadButton Content="Learn" />
                                    <TextBlock Width="3" />
                                    <telerik:RadButton Content="Block"/>
                                </StackPanel>
                            </DataTemplate>
                        </telerik:GridViewDataColumn.CellTemplate>
                    </telerik:GridViewDataColumn>

 

Greetings,
Maya
the Telerik team

[Kjell]

Hello, sorry to bring up an old thread, but this feature got backburnered for a while and just came back up.  I tried your solution but when I click on the button, the row is selected as soon as the mouse button goes down, so before I can drag it. 

Code below...



<telerik:GridViewDataColumn Header="Type" SortMemberPath="Type" DataMemberBinding="{Binding Type}" 

                                                                     IsReadOnly="True" UniqueName="colType" >

                                             <telerik:GridViewDataColumn.CellTemplate>

                                                 <DataTemplate>

                                                       

                                                         <StackPanel VerticalAlignment="Stretch" Background="Transparent" Name="stackType">

                                                             <telerik:RadButton Content="blah" />

                                                         </StackPanel>

                                                       

                                                 </DataTemplate>

                                             </telerik:GridViewDataColumn.CellTemplate>

                                         </telerik:GridViewDataColumn>

[Maya]

Hello Kjell,

I have tested the case and when I click the button in the CellTemplate, the corresponding row is not selected on my side. May you take a look at the sample attached to verify whether I am missing something ? 

Best wishes,
Maya
the Telerik team

[Kjell]

Thanks for the sample.  After a lot of poking around I found some old code of mine that was causing the row to get selected, once I commented that out, the row selection is expected.  However I still have a problem, I can't drag a row if it is not selected, is it possible to do that or does the row have to be selected before it can be dragged?

[Vanya Pavlova]

Hi Kjell,

 

Such drag behavior is controlled by our DragElementAction propertty. You may set this property directly on RadGridView to achieve the desired result.

Regards,
Vanya Pavlova
the Telerik team

[Richard]

is there an example of how to set dragelementaction

Specifically, I want to not select a row when I click on it to drag it, but to select it after I drop it