Is it possible to drag a row without selecting it?

9 posts, 0 answers
  1. Kjell
    Kjell avatar
    283 posts
    Member since:
    Jun 2010

    Posted 10 Feb 2011 Link to this post

    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.
  2. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 16 Feb 2011 Link to this post

    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
  3. Kjell
    Kjell avatar
    283 posts
    Member since:
    Jun 2010

    Posted 16 Feb 2011 Link to this post

    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>
  4. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 22 Feb 2011 Link to this post

    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!
  5. Kjell
    Kjell avatar
    283 posts
    Member since:
    Jun 2010

    Posted 04 Aug 2011 Link to this post

    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>
  6. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 05 Aug 2011 Link to this post

    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 >>

  7. Kjell
    Kjell avatar
    283 posts
    Member since:
    Jun 2010

    Posted 05 Aug 2011 Link to this post

    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?
  8. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 08 Aug 2011 Link to this post

    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 >>

  9. Richard
    Richard avatar
    8 posts
    Member since:
    Jul 2012

    Posted 27 Mar 2012 Link to this post

    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
Back to Top