title: How do I cancel drag between different lists when using angular-ui's sortable module
body: <p>I am using angular-ui's sortable-ui module and am trying to raise a cancel so that the dragged items returns to it original location in the source list.  Unfortunately I cannot get this working.  Here is an example:</p>
  
  <p><a href="http://jsfiddle.net/Ej99f/1/" rel="nofollow">http://jsfiddle.net/Ej99f/1/</a></p>
  
  <pre><code>var myapp = angular.module('myapp', ['ui.sortable']);
  
  myapp.controller('controller', function ($scope) {
  $scope.list = ["1", "2", "3", "4", "5", "6"];
  
  $scope.list2 = ["7", "8", "9"];
  
  $scope.sortableOptions = {
      update: function(e, ui) {
          if (Number(ui.item.text()) === 6) {
              ui.item.parent().sortable('cancel');
          }
      },
      receive: function(e, ui) {            
          ui.sender.sortable('cancel');
          ui.item.parent().sortable('cancel'); 
      },
      connectWith: ".group",
      axis: 'y'
  };
  </code></pre>
  
  <p>});</p>
  
  <p>angular.bootstrap(document, ['myapp']);</p>
  
  <p>Any help would be gratefully appreciated. </p>