[Solved] How to Drag radListView Item in another rad listview

[Richa]

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 

[Maria Ilieva]

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

[Richa]

Hi Maria,

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

Thanks,
Richa

[Maria Ilieva]

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