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

Drag/drop onto a template column

5 Answers 117 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 23 May 2012, 08:57 PM
Hi,

I have multiple RadGrid's (one for every working day in a week), each with a single template column (GridTemplateColumn). Under each row in each grid is another RadGrid containing sub details for that record (using the 'DetailTables' function on the grid). Please find attached screenshot for an example of what I mean (some possibly confidential data has been whited out).

The user can drag and drop each 'subrow' to either a different trip on the same day, or another trip on another day. So they would drag a row to the blue 'header' column (which is my template coumn), or underneath/above another subrow of a trip, and drop the item there. I would then handle the RowDrop event, look at the DestDataItem object in the event to see where it's dropped and perform my processing.

It works great if they drag under another sub-item in a grid, but if they drag to the 'header' (the blue part), the DestDataItem is null - so I'm assuming  it's because they are dragging to a template column. Is there a way around this?

Thanks!

5 Answers, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 28 May 2012, 12:42 PM
Hi,

The problem you are reporting is not caused from the Template column you are using as you could verify from this online demo application.

I made a sample video to illustrate what is the returned value from the get_destinationHtmlElement function on our online demo.

Could you share RadGrid declaration along with the respective event handlers?

Regards,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Chris
Top achievements
Rank 1
answered on 28 May 2012, 09:20 PM
Hi Andrey,

Many thanks for your reply and video - I'm currently not doing any JavaScript checks/operations on DragDrop, it's just server side (i..e posts back on row drop).

Here's my markup:
<telerik:RadGrid ID="gv1" runat="server" CssClass="MyExpandCol" Height="100%" Width="100%" ItemStyle-CssClass="TripRow" AlternatingItemStyle-CssClass="TripRow" OnRowDrop="gv_RowDrop" OnItemDataBound="gv_ItemDataBound" DataSourceID="dsDay1" AllowMultiRowSelection="true" AutoGenerateColumns="false" Font-Size="9px" GridLines="None">
      <MasterTableView AllowPaging="false" AllowSorting="true" ClientDataKeyNames="ID" TableLayout="Fixed" ExpandCollapseColumn-HeaderStyle-Width="10px" ExpandCollapseColumn-CollapseImageUrl="Content/Images/collapse.png" ExpandCollapseColumn-ExpandImageUrl="Content/Images/expand.png" PageSize="50" ShowHeader="false" AllowCustomPaging="false" DataKeyNames="ID" Name="Master" HierarchyDefaultExpanded="true" ShowHeadersWhenNoRecords="false" Font-Size="9px" ItemStyle-CssClass="TripHeaderRow" AlternatingItemStyle-CssClass="TripHeaderRow">
      <DetailTables>
      <telerik:GridTableView Name="Detail" ClientDataKeyNames="ID" TableLayout="Fixed" ShowHeader="false" DataKeyNames="ID" DataSourceID="dsTripDetails" Width="100%" Font-Size="9px" CssClass="DetailGrid">
      <ParentTableRelation>
      <telerik:GridRelationFields DetailKeyField="TripHeaderID" MasterKeyField="ID" />
      </ParentTableRelation>
      <NoRecordsTemplate><br />
      </NoRecordsTemplate>
      <Columns>
        <telerik:GridBoundColumn DataField="DeliveryNoteNo" HeaderText="Ref" SortExpression="DeliveryNoteNo" ItemStyle-Wrap="false" HeaderStyle-Width="22%"></telerik:GridBoundColumn>
      <telerik:GridBoundColumn DataField="PromiseDate" HeaderText="By" SortExpression="PromiseDate" ItemStyle-Wrap="false" HeaderStyle-Width="15%"  DataFormatString="{0:dd MMM}"></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="TrailerDepot" HeaderText="Dep" SortExpression="TrailerDepot" ItemStyle-Wrap="false" HeaderStyle-Width="8%"></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="CustomerName" HeaderText="Customer" SortExpression="CustomerName" ItemStyle-Wrap="false" HeaderStyle-Width="15%"></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="CustomerPostcode" HeaderText="Postcode" SortExpression="CustomerPostcode" ItemStyle-Wrap="false" HeaderStyle-Width="10%"></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="DeliveryWeight" HeaderText="Weight" SortExpression="DeliveryWeight" ItemStyle-Wrap="false" HeaderStyle-Width="13%"></telerik:GridBoundColumn>
    <telerik:GridBoundColumn DataField="PalletsPlanned" HeaderText="Plan" SortExpression="PalletsPlanned" ItemStyle-Wrap="false" HeaderStyle-Width="5%"></telerik:GridBoundColumn>                         
    <telerik:GridBoundColumn DataField="PalletsPicked" HeaderText="Plan" SortExpression="PalletsPlanned" ItemStyle-Wrap="false" HeaderStyle-Width="5%"></telerik:GridBoundColumn>                         
 
 
      </Columns>
      </telerik:GridTableView>
      </DetailTables>
      <Columns>
        <telerik:GridTemplateColumn DataField="ID">
            <ItemTemplate>
            <table width="100%" cellpadding="0" cellspacing="0" border="1" runat="server" ID="tbl">
            <tr><td></td><td>Trip <asp:Label ID="lblID" runat="server" Text='<%# Bind("ID") %>'></asp:Label> <asp:Label ID="lblSubbie" runat="server" Text='<%# Bind("VehicleOrSubbie") %>'></asp:Label> (<asp:Label ID="lblDepot" runat="server" Text='<%# Bind("DepotLetter") %>'></asp:Label>)</td><td>Total:</td><td><asp:Label ID="lblTotalWeight" runat="server" Text='<%# Bind("TotalWeight") %>'></asp:Label></td><td><asp:Label ID="lblTotalPlan" runat="server" Text='<%# Bind("TotalPlan") %>'></asp:Label></td><td><asp:Label ID="lblTotalPick" runat="server" Text='<%# Bind("TotalPick") %>'></asp:Label></td></tr>
            <tr><td></td><td><asp:Label ID="lblNotes" runat="server" Text='<%# Bind("TripNotes") %>'></asp:Label></td><td>Remaining:</td><td><asp:Label ID="lblRemainingWeight" OnDataBinding="SetRemainingColour" runat="server" Text='<%# Bind("RemainingWeight") %>'></asp:Label></td><td><asp:Label ID="lblRemainingPlan" OnDataBinding="SetRemainingColour" runat="server" Text='<%# Bind("RemainingPlan") %>'></asp:Label></td><td><asp:Label ID="lblRemainingPick" OnDataBinding="SetRemainingColour" runat="server" Text='<%# Bind("RemainingPick") %>'></asp:Label></td></tr>
            </table>
            </ItemTemplate>       
        </telerik:GridTemplateColumn>
      </Columns>
         
      </MasterTableView>
      <ClientSettings AllowRowsDragDrop="true">
      <Scrolling AllowScroll="true" SaveScrollPosition="true" />
      <Selecting AllowRowSelect="true" EnableDragToSelectRows="false" />
      <Scrolling UseStaticHeaders="false" AllowScroll="true" />
      <Resizing ClipCellContentOnResize="true" AllowColumnResize="false" />
      </ClientSettings>
      </telerik:RadGrid>

And here's my event handler (there's more code than what I've posted, but it isn't relevant as because the DestDataItem is null, the event doesn't continue

  protected void gv_RowDrop(object sender, GridDragDropEventArgs e)
        {
            if (((e.DestinationTableView == null || (e.DestinationTableView.ParentItem == null && e.DestinationTableView.Name != "Unallocated")) && e.DestDataItem == null))
                return;
}

So just to confirm - dragging onto the template item causes the DestDataItem object to be null, but is correctly set when dragging to either a detail row, or to the left of the template row (on the expand/collapse part of the row)
0
Andrey
Telerik team
answered on 31 May 2012, 04:25 PM
Hi,

Thank you for sharing your code with me.

It is normal to get the destination dataitem as null when the TableView is empty. This is true because when the drop operation occurs the Grid is taking the upper element and if there is no upper element it tries to get the bottom element. If they both are not presented it returns null.

After at least one item is provided you will get the correct item. I made a video to illustrate this approach. Please review the video and let me know whether do you need further assistance.

Greetings,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Chris
Top achievements
Rank 1
answered on 06 Jun 2012, 08:22 AM
Hi again Andrey, thanks for your reply

I have reviewed your video but I think my scenario may be a little different. I've made a screencast to better illustrate this:  http://www.screencast.com/t/kARstN0RWw 

The first time I drop something in, I drag it to the 'expand/collapse' column, and the drop operation succeeds - this is because the DestDataItem tells me which master record the row was dropped onto, then I can assign the dropped item to the master record. The second time I drag, I drag onto the template column. The DestDataItem is then null instead of being the master record, so I have no way of determining which master record it was dragged to - only the name of the whole grid from the DestinationTableView object which is not much use to me.

Thanks!
0
Andrey
Telerik team
answered on 08 Jun 2012, 02:03 PM
Hi,

For further investigation of the project it will be best if you open formal support ticket and send a project that replicates the issue.

Greetings,
Andrey
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Chris
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Chris
Top achievements
Rank 1
Share this question
or