sorted_elements_view.js.coffee

App.SortedElementsView = Ember.View.extend Ember.TargetActionSupport,
  target: Ember.computed.alias('controller')
  action: 'sort'
  classNames: ['sorted-elements']
  attributeBindings: ['id', 'fields']
  elementClass: 'sortable-element'
  didInsertElement: () ->
    elements = ".#{@get('elementClass')}"
    Em.run.next () =>
      hookupSortable = () =>
        @$().sortable(
          items: elements
        ).bind 'sortupdate', (e, i) =>
          positionChanges = {}
          i.item.parent().find('.formbuild').map (i, o) ->
            positionChanges[$(o).data('position')] = i
          @$().sortable('destroy').unbind('sortupdate')

          @triggerAction(actionContext: positionChanges)

          Em.run.schedule 'afterRender', @, hookupSortable
      Em.run.schedule 'afterRender', @, hookupSortable

drag/drop sortable list