updating data object ractive.js ractive.sortable.js

Question

I'm using https://github.com/Nijikokun/ractive.sortable.js to add drag sortable functionality to a table.

 var resources =  [
    {
      rid: "22222225",
      title: "Archive.zip",
      filename: "222343.zip",
      type: "foo",
      duration: "10"
    },
    {
      rid: "22222225",
      title: "Archive.zip",
      filename: "222343.zip",
      type: "foo",
      duration: "10"
    }
       ...
    ]



<tbody id="resourceList" on-sortable='sort-items'>
 {{#each resources:num}}
 <tr rv-each-item="data.resources">
 <td>
 <i class="dragHandle glyphicon glyphicon-move">M</i>
 </td>
 <td class="rTitle">{{title}}</td>
 <td class="rType">{{filename}}</td>
 <td class="rType">{{type}}</td>
 <td class="rDuration">
 {{#if duration}}
 <input type="number" min="10" step="1" value="{{duration}}"> seconds 
 {{/if}} 
 </td>
 <td>
 {{#if resources.length != 1 }}
 <button class="btn" type="button" on-click='removeItem'><i class="deleteRow glyphicon glyphicon-trash"></i>
 </button>
 {{/if}}
 </td>
 </tr>
 {{/each}}
 </tbody>

The dragging works as intended - I'm just having difficulty trying to figure out how I extract the new sort order, and use it to update the order of objects in the data array. I've been playing about with ractive.observe - but can't grok it....

Answer 1

You should not need to update the array in any way. The sortable plugin will do that for you.