2010-06-04 6 views
1

나는 올바른 방법으로이 문제를보고 있지 않을 것이라고 생각합니다.연결된 목록의 동작을 사용하여 jquery-sortable

성능상의 이유로 기존의 링크 된 목록 동작 (즉, "다음"개체의 참조/ID를 업데이트)을 사용하여 조작하려는 웹 페이지 (http://en.wikipedia.org/wiki/Linked_list)에 기본적으로 LinkedList가 있습니다.

여기가 약간 까다 롭습니다. Jquery의 sortable을 사용하는 것이 이상적입니다. 사용자가 무언가를 위/아래로 드래그하면 이동 한 객체의 ID와 해당 객체의 새로운 부모 ID로 서버에 대한 Ajax 호출을 수행 할 수 있습니다. 그리고 나서 사물을 다시 연결하는 방법을 알아낼 수 있습니다 .. 그보다 더 많은 데이터가 필요할 수 있습니다 ...).

그러나 sortable이 사용 된 곳에서 모든 예가 나와서 데이터베이스에 전체 다시 인덱싱 된 목록을 보내서 내게 불필요한 것으로 보였습니다. 요소의 "인덱스"를 변경하는 링크 된 목록을 사용하면 목록의 크기에 따라 성능을 크게 향상시킬 수있는 3 가지 업데이트 만하면됩니다. 누구든지 제가하려고하는 것에 대한 모범을 보았습니다 ... 나는 너무 멀리 왼쪽 필드에 있습니까?

답변

2

정렬 할 수있는 '시작'및 '업데이트'이벤트에 연결하여 어떤 항목이 어디로 이동했는지 파악한 다음 해당 인덱스 만 서버로 보냄으로써이를 해결했습니다.

var items; 

$('ul#sortable').sortable({ 
    start: function() { 
     items = $('li.item:not(.ui-sortable-placeholder)', this); 
    }, 
    update: function() { 
     $('li.item:not(.ui-sortable-placeholder)', this).each(function(i) { 
      var order = items.index(this); 
      if (order > i + 1 || order < i) { 
       // do ajax request here 
       console.log('item %d was moved to %d', order, i); 
       return false; 
      } 
     }); 
    } 
}); 

결과 파이썬

items.insert(index2, items.pop(index1)) 
만큼이나 간단 서버에 저장된리스트를 재정렬하기 위해 사용 된
관련 문제