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

Issue with RadGrid drag-and-drop nested within RadTreeList

1 Answer 71 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Derezzed asked on 25 Sep 2015, 04:09 PM

So I seem to have run into an interesting issue with drag-and-drop in a RadGrid within a RadTreeList.  

My scenario is this:  I have a RadTreeList where each item in the list contains a RadGrid in the DetailTemplate.  The RadTreeList uses drag-and-drop to nest the items in its list.  Each RadGrid in the DetailTemplate (there is 1 grid per template) also used drag-and-drop for re-ordering the items in that grid.

I am still building this, but right now I can drag the RadTreeList items without any issues.  However, when I go to drag any of the items in the RadGrids, I see 2 rows as if I was dragging multiple items.  If I start to drag a RadTreeListItem first and then immediately stop, and then go to drag a RadGrid item, I see the RadGrid row behind the RadTreeListItem row.  Very strange.  Also, both controls are designed to use a TreeListDragDropColumn/GridDragDropColumn for dragging.  If I remove the DragDropColumn from EITHER one of them, I do not see the duplicate row when dragging a RadGrid item.  If I remove the DragDropColumn from BOTH of them, it will still display the duplicate.

I would like to have the drag columns visible for both, but for right now it doesn't seem like I can do that. 

I've attached screenshots to help explain what I am talking about.  In order they are:  1. The RadTreeList with ​RadGrids before any dragging, 2. Dragging from the RadGrid, 3. Dragging from the RadTreeList, 4. Dragging from the RadGrid after dragging from the RadTreeList

Essentially, here's my markup:

    <telerik:RadTreeList ID="TreeList" runat="server" Skin="Silk" AutoGenerateColumns="false" AllowSorting="true" GridLines="None" ShowTreeLines="false"
        ParentDataKeyNames="ParentId" DataKeyNames="Id" AllowPaging="false" EditMode="InPlace" ValidationSettings-ValidationGroup="Edit"
        OnNeedDataSource="TreeList_NeedDataSource" OnItemCommand="TreeList_ItemCreated" OnItemCreated="TreeList_ItemCreated" OnItemDataBound="TreeList_ItemDataBound">
        <ClientSettings AllowItemsDragDrop="true">
            <Selecting AllowItemSelection="True"></Selecting>
            <telerik:TreeListEditCommandColumn ButtonType="ImageButton" ItemStyle-Width="25px" ItemStyle-VerticalAlign="Middle" ShowAddButton="false" UniqueName="EditCommandColumn"></telerik:TreeListEditCommandColumn>
            <telerik:TreeListTemplateColumn DataField="Name" UniqueName="Name" HeaderText="Name" ItemStyle-Wrap="false" ItemStyle-Width="720px">
                    <asp:Label ID="Name" runat="server" Text='<%# Eval("Name") %>'></asp:Label><telerik:RadToolTip ID="ToolTip" runat="server" AutoCloseDelay="0" TargetControlID="Name" RelativeTo="Element" Animation="Slide" AnimationDuration="100" Position="BottomCenter" RenderInPageRoot="true" Width="460"></telerik:RadToolTip>
                    <br /><asp:Label ID="Description" runat="server" Text='<%# Eval("Description") %>'></asp:Label>
                    <asp:TextBox ID="NameEdit" runat="server" MaxLength="50" Text='<%# Eval("Name") %>' ValidationGroup="Edit" Width="100%"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="NameEditRFV" runat="server" CssClass="alert" ControlToValidate="NameEdit" ErrorMessage="Please enter a Folder Name" ValidationGroup="Edit"></asp:RequiredFieldValidator>
                    <br /><asp:TextBox ID="DescriptionEdit" runat="server" MaxLength="100" style="width: 100%;" Text='<%# Eval("Description") %>' ValidationGroup="Edit"></asp:TextBox>
                <telerik:RadGrid ID="DetailGrid" runat="server" Skin="Silk" Width="100%" AutoGenerateColumns="False" GridLines="None" AllowPaging="false" AllowSorting="false" ShowHeader="false"
                    OnNeedDataSource="DetailGrid_NeedDataSource" OnItemCommand="DetailGrid_ItemCommand" OnItemDataBound="DetailGrid_ItemDataBound" OnRowDrop="DetailGrid_RowDrop">
                    <ClientSettings AllowRowsDragDrop="true">
                        <ClientEvents OnPopUpShowing="popUpShowing" OnRowDropping="rowDropping" />
                        <Selecting AllowRowSelect="true" />
                    <MasterTableView DataKeyNames="DetailId" Name="Details" EditMode="PopUp">
                            <telerik:GridDragDropColumn HeaderStyle-Width="18px"></telerik:GridDragDropColumn>
                            <telerik:GridEditCommandColumn ButtonType="ImageButton" ItemStyle-Width="25px" ItemStyle-VerticalAlign="Middle" UniqueName="EditCommandColumn"></telerik:GridEditCommandColumn>
                            <telerik:GridBoundColumn DataField="Name" HeaderText="Name" UniqueName="Name" />
                            There are no details.

1 Answer, 1 is accepted

Sort by
Maria Ilieva
Telerik team
answered on 30 Sep 2015, 11:54 AM

Can you please share the related code behind as well as the client functions you have on the page? Thus we can test the exact scenario on our end and advise you further.

Maria Ilieva
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Asked by
Top achievements
Rank 1
Answers by
Maria Ilieva
Telerik team
Share this question