This addon allows you to use drag and drop in your ember application using SortableJS/Sortable
- Ember.js v2.18 or above
- Ember CLI v2.13 or above
ember install ember-sortablejs
<SortableJs
@options={{hash animation=150 ghostClass="ghost-class" group="shared-list"}}
@onChoose={{action "trigger" "onChoose"}}
@onUnchoose={{action "trigger" "onUnchoose"}}
@onStart={{action "trigger" "onStart"}}
@onEnd={{action "trigger" "onEnd"}}
@onAdd={{action "trigger" "onAdd"}}
@onUpdate={{action "trigger" "onUpdate"}}
@onRemove={{action "trigger" "onRemove"}}
@onMove={{action "trigger" "onMove"}}
@onClone={{action "trigger" "onClone"}}
@onChange={{action "trigger" "onChange"}}
as |sortable|
>
<ul class="list-group">
<li class="list-group-item bg-yellow">Item 1</li>
<li class="list-group-item bg-yellow">Item 2</li>
<li class="list-group-item bg-yellow">Item 3</li>
<li class="list-group-item bg-yellow">Item 4</li>
<li class="list-group-item bg-yellow">Item 5</li>
</ul>
</SortableJs>
The addon supports all the options that sortable accepts, see: https://github.com/SortableJS/Sortable#options
Options are passed using the {{hash}}
helper.
The events:
onChoose
onUnchoose
onStart
onEnd
onAdd
onUpdate
onSort
onRemove
onMove
onClone
onChange
scrollFn
onSetData
setData
onFilter
Should be in the component signature as closure actions. All actions get the events as described in the SortableJS docs as the sortable instance.
This project is licensed under the MIT License.