How to Drag radListView Item in another rad listview

4 posts, 0 answers
  1. Richa
    Richa avatar
    10 posts
    Member since:
    Jan 2014

    Posted 16 Jan 2014 Link to this post

    Hi,

    I am using radlistview control, and i want to drag radlistview item and drop in another radlistview. please help me by providing me the example.. it's urgent

    Thanks In advance

    Thanks
     Richa 
  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 20 Jan 2014 Link to this post

    Hello Richa,

    You could review the online demo below, which provide basic approach for achieving drag and drop functionality with RadListView. the same could be easily customized to drop into another ListView control following the provided logic.
    http://demos.telerik.com/aspnet-ajax/listview/examples/itemdragdrop/defaultcs.aspx

    Regards,
    Maria Ilieva
    Telerik
    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 the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Richa
    Richa avatar
    10 posts
    Member since:
    Jan 2014

    Posted 23 Jan 2014 Link to this post

    Hi Maria,

    I have Implemented this code but this is not working in all browsers except Internet Explorer.

    Thanks,
    Richa

  5. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 28 Jan 2014 Link to this post

    Hello Richa,

    Try the code below which works on every browser on my end:
    div>
        <telerik:RadListView runat="server" ID="RadListView1">
            <ItemTemplate>
                <div class="rlvI">
                    <telerik:RadListViewItemDragHandle ID="RadListViewItemDragHandle1" runat="server" />
                    data....
                </div>
            </ItemTemplate>
            <ClientSettings AllowItemsDragDrop="true">
                <ClientEvents OnItemDropping="itemDropping" />
            </ClientSettings>
        </telerik:RadListView>
    </div>
    <div>
        <telerik:RadListView runat="server" ID="RadListView2">
            <ItemTemplate>
                <div class="rlvI" onmouseover='itemMouseOver("<%#Container.DisplayIndex %>")' onmouseout='itemMouseOut();'>
                    data....
                </div>
            </ItemTemplate>
        </telerik:RadListView>
    </div>
    <script type="text/javascript">
        var currentDestinationIndex = -1;
        function itemDropping(sender, args) {
            var destIndex = currentDestinationIndex;
            alert("dragged item index:" + args.get_itemIndex());
            if (destIndex > -1) {
                alert("destination index:" + destIndex);
            }
            else {
                alert("Not over RadListView2 items");
            }
        }
        function itemMouseOver(displayIndex) {
            //save the id in a variable when dragged item is over
            currentDestinationIndex = displayIndex;
        }
        function itemMouseOut() {
            //clear the variable if dragged item leaves 
            //destination item boundaries
            currentDestinationIndex = -1;
        }
    </script>
     and let me know if it works for you.

    Regards,
    Maria Ilieva
    Telerik
    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 the blog feed now.
Back to Top