2010-06-16 6 views
4

한 목록에서 항목을 이동하는, 내가 UL의 사이에 (오히려 사본보다) LI 요소를 이동하는 방법을 알아낼 수 없습니다.jQuery를 UI :이 <em>이</em> 비교적 간단해야하지만 다른

내가 원하는 모든 요소를 ​​복제하지 않고 (또는 그 반대)를 나열하는 목록 foo는에서 모든 항목을 드래그하는 것입니다. 예를 들어 보장 (수동 stop 이벤트에 반응하여 원래 요소를 제거하는 것은 그렇게 쉬운 일이 아닙니다 것으로 밝혀 - connectToSortable 동안

거의 정확하게 내가 원하는 것을 (나는 sortable을 피하기 위해 선호하는 거라고하지만), 그것은 요소를 복제합니다 유효한 드롭이 실제로 발생했음을 나타냄).

간단한 "hello world"예제는 나를 크게 도와 줄 것입니다.

답변

6

Hello World의 예는 http://jqueryui.com/demos/sortable/#connect-lists입니다. 은 전혀 필요하지 않으며 sortable 만 입력하면됩니다.

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: '.connectedSortable' 
    }).disableSelection(); 
}); 

목록에서 항목을 정렬하지 않으려면 이동하는 것이 좋습니다. 그것은 가장 아름다운 UI는 아니지만 (사용자가 잘못된 희망을 갖게 됨), 사용자는 자유롭게 외부 목록의 드롭 위치를 결정할 수 있습니다.

$(function() { 
    var sender; 
    var recvok = false; 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: '.connectedSortable', 
     start: function() { 
      sender = $(this); 
      recvok = false; 
     }, 
     over: function() { 
      recvok = ($(this).not(sender).length != 0); 
     }, 
     stop: function() { 
      if (!recvok) 
       $(this).sortable('cancel'); 
     } 
    }).disableSelection(); 
}); 

이 내가 jQuery를 UI의 불완전 느끼는 것을 주위에 일하는 정말 끔찍한 기능입니다. 보낸 사람을 sortstart에 저장하고 삭제할 수있는 플래그를 사용합니다. 다른 수신자가 입력되면 송신자가 아닌지 확인하고 플래그를 올립니다. sortstop에서 플래그가 점검됩니다. 경고 :이 기능은 사용자와 프로그래머의 눈에는보기 흉하지만 작동합니다.

+0

와우, 분명히 나는 ​​틀린 장소를보고 있었다 - 감사합니다! – AnC

+1

사용자가 하나의 목록에서 항목을 정렬 할 수있게 하시겠습니까? 또한이를 비활성화하는 방법이 있습니다. – MvanGeest

+0

그것은 실제로 유용 할 것입니다! – AnC

관련 문제