Using DetailsView in RadGrid

[Ceramist]

I use the ItemTemplate of my RadGrid to host a DetailsView.  I also have enabled RadGrid to employ drag-and-drop functionality.  When I select the desired row, I can start the drag-and-drop action if I select a region of the actual Radgrid row but not if I am inside the region of the DetailsView.  If I replace the DetailsView with an asp:Label, I can initiate the drag-and-drop functionality so this issue must be associated with the mouse related events.  I also get this same behavior if I replace DetailsView with a second RadGrid, I must select the region of the row corresponding to the primary RadGrid hosting the second RadGrid in order to initiate the drag-and-drop. 

Would anyone in the community have some advice for forcing the selection of a row to correspond to the primary or hosting RadGrid, regardless of the internal set of controls?

As a secondary question, when I do use a primary RadGrid hosting the second RadGrid, I need to force the second RadGrid to not accept drag-and-drop items. 

I will diligently search the event models but your advice would be appreciated.

[Veli]

Hi Walter,

RadGrid's Item drag & drop functionality does not function when you press the mouse button over a child element of the parent <tr> row. The reason for this is that the drag starts on the client onmousedown event of the dragged item only.

Unfortunately, this design decision for RadGrid's Drag&Drop functionality requires that the user strictly clicks over the <tr> element of the parent grid to drag the row.

Sincerely yours,
Veli
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[NK]

Please Help me.I had wasted much time ,but not yet solved.Expand is working  but collapse not working

<script type="text/javascript">
    function UpdateItemCountField(sender, args) {
        //set the footer text
        sender.get_dropDownElement().lastChild.innerHTML = "A total of " + sender.get_items().get_count() + " items";
    }
</script>
<style type="text/css">
    .rcbHeader ul, .rcbFooter ul, .rcbItem ul, .rcbHovered ul, .rcbDisabled ul
    {
        width: 100%;
        display: inline-block;
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    
    .col1
    {
        float: left;
        width: 220px;
        margin: 0;
        padding: 0 5px 0 0;
        line-height: 14px;
    }
    .col2, .col3
    {
        float: left;
        width: 110px;
        margin: 0;
        padding: 0 5px 0 0;
        line-height: 14px;
    }
    
    label, .selection-result
    {
        font: 13px 'Segoe UI' , Arial, sans-serif;
        color: #4888a2;
    }
    
    label
    {
        padding: 0 10px 0 0;
    }
    
    .button
    {
        vertical-align: middle;
        margin-left: 10px;
    }
    
    .selection-result
    {
        padding: 10px 0 10px 0;
        display: block;
    }
    
    div.bigModuleBottom
    {
        padding-top: 25px;
    }
    .multipleRowsColumns .rcbItem, .multipleRowsColumns .rcbHovered
    {
        float: left;
        margin: 0 1px;
        min-height: 13px;
        overflow: hidden;
        padding: 2px 19px 2px 6px;
        width: 125px;
    }
    html.rfdButton a.rfdSkinnedButton
    {
        vertical-align: middle;
        margin: 0 0 0 5px;
    }
    label
    {
        display: inline-block;
        width: 200px;
        text-align: right;
        padding-right: 5px;
        margin-top: 10px;
    }
    * html.rfdButton a.rfdSkinnedButton, * html.rfdButton input.rfdDecorated
    {
        vertical-align: top;
    }
</style>
<div class="content-container clearfix" id="divTop" runat="server">
    <asp:UpdatePanel ID="updPanelGrid" runat="server">
        <ContentTemplate>
            <div>
                <rad:RadComboBox ID="RadComboBox1" runat="server" Height="190px" Width="420px" EmptyMessage="Select a Person"
                    EnableLoadOnDemand="true" HighlightTemplatedItems="true" OnClientItemsRequested="UpdateItemCountField"
                    OnDataBound="RadComboBox1_DataBound" OnItemDataBound="RadComboBox1_ItemDataBound"
                    OnItemsRequested="RadComboBox1_ItemsRequested" AutoPostBack="true" MarkFirstMatch="true">
                    <HeaderTemplate>
                        <ul>
                            <li class="col1">Name</li>
                            <li class="col2">ID</li>
                        </ul>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <ul>
                            <li class="col1">
                                <%# DataBinder.Eval(Container.DataItem, "FirstLast")%><br />
                                <%# DataBinder.Eval(Container.DataItem, "Title")%></li>
                            <li class="col2">
                                <%# DataBinder.Eval(Container.DataItem, "ID")%></li>
                        </ul>
                    </ItemTemplate>
                    <FooterTemplate>
                        A total of
                        <asp:Literal runat="server" ID="RadComboItemsCount" />
                        items
                    </FooterTemplate>
                </rad:RadComboBox>
                <rad:RadComboBox ID="RadComboBox2" runat="server" Height="190px" Width="420px" EmptyMessage="Select a Product Category"
                    EnableLoadOnDemand="true" HighlightTemplatedItems="true" OnClientItemsRequested="UpdateItemCountField"
                    OnDataBound="RadComboBox2_DataBound" OnItemDataBound="RadComboBox2_ItemDataBound"
                    OnItemsRequested="RadComboBox2_ItemsRequested" AutoPostBack="true" MarkFirstMatch="true">
                    <HeaderTemplate>
                        <ul>
                            <li class="col1">ProductCategory</li>
                        </ul>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <ul>
                            <li class="col1">
                                <%# DataBinder.Eval(Container.DataItem, "ProductCategory")%></li>
                        </ul>
                    </ItemTemplate>
                    <FooterTemplate>
                        A total of
                        <asp:Literal runat="server" ID="RadComboItemsCount1" />
                        items
                    </FooterTemplate>
                </rad:RadComboBox>
            </div>
            <telerik:RadGrid ID="grdMain" ShowStatusBar="true" runat="server" AutoGenerateColumns="False"
                AllowSorting="True" AllowMultiRowSelection="False" AllowPaging="True" GridLines="None"
                EnableViewState="true">
                <PagerStyle Mode="NumericPages"></PagerStyle>
                <MasterTableView DataKeyNames="ID" AllowMultiColumnSorting="True" HierarchyLoadMode="ServerOnDemand">
                    <DetailTables>
                        <telerik:GridTableView DataKeyNames="ID" Width="100%" runat="server">
                            <Columns>
                                <rad:GridTemplateColumn HeaderText="Product">
                                    <ItemTemplate>
                                        <asp:Label ID="Product" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Product") %>'></asp:Label>
                                    </ItemTemplate>
                                </rad:GridTemplateColumn>
                                <rad:GridBoundColumn DataField="ProductType" HeaderText="Type" />
                                <rad:GridBoundColumn DataField="Description" HeaderText="Description" />
                                <rad:GridBoundColumn DataField="Quantity" HeaderText="Quantity" DataFormatString="{0:F0}"
                                    HeaderStyle-HorizontalAlign="Right" ItemStyle-HorizontalAlign="Right" />
                                <rad:GridBoundColumn DataField="Price" HeaderText="Price" DataFormatString="{0:c}"
                                    HeaderStyle-HorizontalAlign="Right" ItemStyle-HorizontalAlign="Right" />
                                <rad:GridBoundColumn DataField="Discount" HeaderText="Discount" DataFormatString="{0:F2}"
                                    HeaderStyle-HorizontalAlign="Right" ItemStyle-HorizontalAlign="Right" />
                            </Columns>
                        </telerik:GridTableView>
                    </DetailTables>
                    <Columns>
                        <rad:GridTemplateColumn HeaderText="Order #" HeaderButtonType="TextButton" SortExpression="ID"
                            DataField="ID" UniqueName="ID">
                            <ItemTemplate>
                                <asp:HyperLink ID="Product" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"ID") %>'
                                    NavigateUrl='<%# DataBinder.Eval(Container.DataItem,"LinkUrl") %>'></asp:HyperLink>
                            </ItemTemplate>
                        </rad:GridTemplateColumn>
                        <%--   <telerik:GridHyperLinkColumn SortExpression="ID" HeaderText="Order #" HeaderButtonType="TextButton"
                            DataTextField="ID" UniqueName="ID"></telerik:GridHyperLinkColumn>--%>
                        <rad:GridBoundColumn DataField="OrderDate" HeaderText="Date" DataFormatString="{0:d}" />
                        <rad:GridBoundColumn DataField="CurrencyType" HeaderText="Currency" />
                        <rad:GridTemplateColumn HeaderText="Total" DataField="CALC_GrandTotal">
                            <ItemTemplate>
                                <asp:Label ID="lblCALC_GrandTotal" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"CALC_GrandTotal") %>'></asp:Label>
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Center" />
                            <HeaderStyle HorizontalAlign="Right" Width="60px" />
                        </rad:GridTemplateColumn>
                        <rad:GridBoundColumn DataField="OrderStatus" HeaderText="Shipping Status" />
                        <rad:GridBoundColumn DataField="ShipType" HeaderText="Shipping Type" />
                        <rad:GridBoundColumn DataField="BillToName" HeaderText="Bill to Person" />
                    </Columns>
                </MasterTableView>
            </telerik:RadGrid>
            <%--<rad:RadGrid ID="grdMain" runat="server" AutoGenerateColumns="False" AllowPaging="true"
                AllowFilteringByColumn="true">
                <MasterTableView AllowFilteringByColumn="true">
                    <Columns>
                        <rad:GridHyperLinkColumn Text="ID" DataNavigateUrlFields="ID" DataTextField="ID"
                            HeaderText="Order #" />
                        <rad:GridBoundColumn DataField="OrderDate" HeaderText="Date" DataFormatString="{0:d}" />
                        <rad:GridBoundColumn DataField="CurrencyType" HeaderText="Currency" />
                        <rad:GridTemplateColumn HeaderText="Total" DataField="CALC_GrandTotal">
                            <ItemTemplate>
                                <asp:Label ID="lblCALC_GrandTotal" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"CALC_GrandTotal") %>'></asp:Label>
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Center" />
                            <HeaderStyle HorizontalAlign="Right" Width="60px" />
                        </rad:GridTemplateColumn>
                        <rad:GridBoundColumn DataField="OrderStatus" HeaderText="Shipping Status" />
                        <rad:GridBoundColumn DataField="ShipType" HeaderText="Shipping Type" />
                        <rad:GridBoundColumn DataField="ShipTrackingNum" HeaderText="Tracking #" />
                    </Columns>
                </MasterTableView>
            </rad:RadGrid>--%>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>
<cc1:User runat="server" ID="User1" />

[Antonio Stoilkov]

Hello,

Based on your code I have assembled project try to replicate the described issue but to no avail. In order to further investigate you could modify the provided page, open a formal ticket and attach the file so we could investigate and advise you with the best possible solution.

Additionally, you could remove the UpdatePanel and try to run your application in order to observe if there are any server side exceptions thrown.

Kind regards,
Antonio Stoilkov
the Telerik team