Angularjs ui-sortable - _connectedSortables is undefined

我有2個可排序的列表，我試圖將它們連接起來，這樣我就可以將項目從一個列表拖到另一個列表中。當我拖動一個項目時，我在sortable.js中得到一個錯誤。 callbacks.update引用了ui.item.sortable._connectedSortables，但它沒有定義，所以當它到達getElementScope函數時，它會拋出錯誤。Angularjs ui-sortable - _connectedSortables is undefined

UPDATE

我多一點背景，我怎麼來到這裏。最初，我有這個工作。我設置了一個可拖動列表並將其連接到可排序列表，並且所有工作都正常。那時我遇到的問題是在可排序列表中拖動時，模型沒有得到更新。一旦我添加了ui-sortable標籤，模型在重新排序列表時開始得到更新，但在此之後就是前面提到的錯誤發生時。 2塊的代碼之間的差異是在我正在設置的可排序這樣的第一個例子：

$('#testQuestionsTEI').sortable({//code});

並有在標記沒有UI可排序屬性。現在我在標記中使用了ui-sortable =「sortable」，並且有$ scope.sortable = {// code}。

我擁有的第一個列表是接受列表。

<div id ="testQuestionsTEI" class="connectedSortable" ui-sortable="sortable" ng-model="test.questions" style="overflow-x:auto; overflow-y: scroll"> 
          <div class="TestQuestion" ng-repeat="currQuestionObj in test.questions" style="border:1px solid;padding:7px 7px 7px 7px;margin-top:3px;margin-bottom:3px"> 
           <!--do some stuff--> 
          </div> 
         </div>

的JS設置的排序是這裏...

$scope.sortable = { 
    placeholder: 'questionPlaceholderTEI', 
    connectWith: '.connectedSortable', 
    start: function (event, ui) { 
     ui.item.startPos = ui.item.index();     //add startPos to item to use in stop event 
    }, 
    stop: function (event, ui) { 
     //Do stuff 
     } 

    }, 
    update: function (event, ui) { 
     //Do stuff 
    } 
};

第2列表是一個Ajax調用，它是HTML建成後...

<div id="SearchResultItems" ui-sortable="sortable" class="col-md-12 connectedSortable" style="border:1px solid;padding:0 5px 0 5px;" ng-cloak> 
<div class="SearchResultItem" index="{{currQuestionObj.id}}" QuestionID="{{currQuestionObj.questionId}}" ngc-done="'setupDraggableItems'" ng-repeat="currQuestionObj in ItemSearchResult.questions" style="border:1px solid;padding:7px 7px 7px 7px;margin-top:3px;margin-bottom:3px" > 
    <!--more stuff--> 
</div>

數據返回後，我設置可拖動和排序

function setupDraggableItems() { 
$('div.SearchResultItem').draggable({ 
    revert: 'clone', 
    scroll: false, 
    helper: 'clone', 
    cursor: 'move', 
    appendTo: 'body', 
    connectToSortable: '#testQuestionsTEI', 
}); 

$('#SearchResultItems').sortable({ 
    placeholder: 'questionPlaceholderTEI', 
    connectWith: '.connectedSortable' 
}); 
}

我也嘗試沒有.draggable，我得到了一個不同的錯誤。在callbacks.update中有一個對ui.item.sortable.isCanceled（）的引用，錯誤是「對象不支持屬性或方法」isCanceled'

來源

2016-04-15 RUEMACHINE

我發現問題是當創建可排序的兩種不同的方式我是在做它們實際上是不同的實現，一個是直接使用Jquery-ui，另一個是angular的ui-sortable，於是我又回到了使用$（'#testQuestionsTEI'）。其他模型沒有更新的問題通過調用$ scope來修復。$ apply（）。

來源

2016-04-15 16:31:38 RUEMACHINE

Angularjs ui-sortable - _connectedSortables is undefined

回答

相關問題