ListView Drag&Drop to RadEditor

3 posts, 0 answers
  1. Daniel Frumkin
    Daniel Frumkin avatar
    19 posts
    Member since:
    Jun 2004

    Posted 07 Sep 2010 Link to this post

    Hi,

    I'm using RadControls for ASP.NET AJAX Q2 2010 in my 3.5 web app. 

    My goal is to implement drag & drop from the RadListView to the RadEditor, and so I've copied from the ListView Demo. My code seems to work find, I can click on the DragHandle and drag the item around the page, but as soon as I hover over the RadEditor the dragging becomes erratic, and releasing the button has no effect.

    If I drag and drop to any other element on the page the sample code works fine. Here's my aspx page:

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="edittest.aspx.vb" Inherits="TripReports_edittest" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="scriptman" runat="server" />
            <h1>
                Media Gallery</h1>
            <p>
                You can use all of these images in your report.</p>
            <telerik:RadListView ID="rlvItems" runat="server" DataKeyNames="FileURL" ClientDataKeyNames="FileURL,SourceURL">
                <ClientSettings AllowItemsDragDrop="true">
                    <ClientEvents OnItemDragStarted="itemDragStarted" OnItemDropping="trackDropping" />
                </ClientSettings>
                <ItemTemplate>
                    <div class="rlvI">
                        <telerik:RadListViewItemDragHandle ID="RadListViewItemDragHandle1" runat="server"
                            ToolTip="Drag to organize" />
                        <asp:Image ID="image" runat="server" />
                    </div>
                </ItemTemplate>
            </telerik:RadListView>
            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

                <script type="text/javascript">
                    var originalMsg = "";

                    function itemDragStarted(sender, args)
                    {
                    }

                    function itemDragging(sender, args)
                    {
                    }

                    function showAction(title)
                    {
                    }

                    function trackDropping(sender, args)
                    {
                    }
                </script>

            </telerik:RadCodeBlock>
            <div id="radEditor">
                <telerik:RadEditor SkinID="BasicSetOfTools" Width="700" Height="500" ID="RadEditor1"
                    runat="server">
                    <Content>
                    </Content>
                </telerik:RadEditor>
            </div>
        </div>
        </form>
    </body>
    </html>

    Has anyone successfully done this?
  2. Daniel Frumkin
    Daniel Frumkin avatar
    19 posts
    Member since:
    Jun 2004

    Posted 08 Sep 2010 Link to this post

    I can't seem to find anywhere in the documentation that the radeditor is compatable with the listview, so I'm assuming that it is not. At this point I am customizing the rad tree view with css to achieve my ui goals.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 09 Sep 2010 Link to this post

    Hello Daniel,

    This is not supported out of the box and dragging over iframe(as the case with RadEditor) might cause some issues. However I am attaching one possible way to implement such functionality. Please find the attachment.

    All the best,
    Nikolay
    the Telerik team
    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 Public Issue Tracking system and vote to affect the priority of the items
Back to Top