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

Drag & Drop from Sortable-Panel to other window

1 Answer 354 Views

Sortable

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

Gerd asked on 03 Feb 2015, 04:30 PM

We like to create an angular spa webproject, where customers can build their dashboard using a sortable panel. Inside the sortable item there is a list of items which should be draggable to other windows (other Programs) to drop them there and read the assigned transfer data.
But I couldn't achieve this because everytime the whole widget takes the drag-events, not the single item.

Here some code:

I use some panels like this:

<div class="panel-wrap" panel-wrapper ng-controller="PanelCtrl as panelCtrl">

<div ng-repeat="panelCol in panelCtrl.panels">

<panel-column panel-col="panelCol"></panel-column>

</div>

with each panel (directive 'panelColumn'):

<div class="col-sm-4 col-md-2" id="{{panelCol.id}}" kendo-sortable k-placeholder="panelCol.placeholder"

k-hint="panelCol.hint" k-connect-with="{{panelCol.others}}">

<my-item-list channel="panelCol"></my-item-list>

</div>

and then the items for the panel (directive 'myItemList'):

<div class="widget k-widget" id="{{myCtrl.id}}">

<span class="widget-header">

<h4>

<img ng-src="{{myCtrl.img}}" />

{{myCtrl.title}}

<span class="collapsed k-icon k-i-arrowhead-n pull-right"></span>

</h4>

</span>

<div class="k-widget collapsablelist" style="height:400px;">

<perfect-scrollbar class="scroller" wheel-propagation="true" suppress-scroll-x="true" wheel-speed="50"

refresh-on-change="someArray" on-scroll="onScroll(scrollTop, scrollHeight)">

<div ng-repeat="d in myCtrl.data">

<my-item item="d"></my-item>

</div>

</perfect-scrollbar>

</div>

and here

<div class="item"ng-style="{'border-left-color': item.color }" item-draggable="true" draggable="true">

.. some content here ...

</div>

I tried all of the examples but couldn't find a solution for this problem. Also tried to use the plain jquery sortable as in the panel example (even with handle) but no luck.

Could you please give me a hint or even better an example how to drag some thing out of a sortable panel?

Best regards
Gerd

Drag & Drop from Sortable-Panel to other window

1 Answer, 1 is accepted