This is a migrated thread and some comments may be shown as answers.

Is it possible to drag a row without selecting it?

8 Answers 35 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Kjell
Top achievements
Rank 1
Kjell asked on 10 Feb 2011, 10:39 PM
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.

8 Answers, 1 is accepted

Sort by
0
Maya
Telerik team
answered on 16 Feb 2011, 02:05 PM
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
0
Kjell
Top achievements
Rank 1
answered on 16 Feb 2011, 09:33 PM
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>
0
Maya
Telerik team
answered on 22 Feb 2011, 02:35 PM
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
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
0
Kjell
Top achievements
Rank 1
answered on 04 Aug 2011, 10:21 PM
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>
0
Maya
Telerik team
answered on 05 Aug 2011, 09:14 AM
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

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

0
Kjell
Top achievements
Rank 1
answered on 06 Aug 2011, 01:02 AM
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?
0
Vanya Pavlova
Telerik team
answered on 08 Aug 2011, 12:18 PM
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

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

0
Richard
Top achievements
Rank 1
answered on 27 Mar 2012, 11:15 PM
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
Tags
GridView
Asked by
Kjell
Top achievements
Rank 1
Answers by
Maya
Telerik team
Kjell
Top achievements
Rank 1
Vanya Pavlova
Telerik team
Richard
Top achievements
Rank 1
Share this question
or