2011-08-22 3 views
0

옵션으로 초기화 된 비디오의 정렬 가능한 목록이 있습니다.jQuery Draggable + Sortable - 정렬 가능한 항목을 변경하는 방법?

items: '.videoBox:not(.isFirst, .isLast)', 

첫 번째이자 마지막 비디오는 정렬 할 수 없으며 어떤 방식으로도 드래그 할 수 없습니다.

이것은 connectToSortable 옵션을 사용하여 다른 드래그 가능한 비디오 목록에 연결됩니다. 내가 isLastisFirst 비디오 사이에 드래그 할 수 있기를 원하는 비디오들 (그 중 많은 것들이 있습니다.) 그래서 나는이 아이템들을 다시 정렬 할 필요가 있기 때문에 다음과 같이 사용합니다 :

start: function(event, ui) { 
    if (// my test //) 
    { 
     $('#timeline').sortable('option', 'items', '.videoBox'); 
    } 
}, 

이전에 정렬 할 수 없었던 항목들 사이에서 드래그 앤 드롭하십시오.

이제 드래그가 끝나면 sortable을 초기 설정으로 되돌리고 싶습니다. 그래서 이것을 draggable init에 넣습니다 :

stop: function() { 
    if (// my test //) 
    { 
    $('#timeline').sortable('option', 'items', '.videoBox:not(.isFirst, .isLast)'); 
    $('#timeline').sortable('refresh'); 
    $('#timeline .videoBox.isLast, #timeline .videoBox.isFirst').draggable('destroy'); 
    } 
}, 

이것은 draggable이 #timeline . 그러나 #timeline로 떨어지면이 콜백은 호출되지 않습니다 (?). 정렬 가능한 이벤트에 똑같은 코드를 추가했습니다 : stop, update, deactivate 그리고 이러한 콜백이 실행되는 것을 볼 수 있지만 isFirstisLast 비디오는 여전히 드래그 가능합니다.

그러나 그들은 정렬 할 수 없습니다 - 그래서 문제가 .draggable('destroy') 비트 거짓말 같아요 ... 어떤 아이디어/제안?

건배, Tom

답변

0

나는 수정 또는 위의 문제의 원인을 식별 할 수 있었다 havent 한. 그러나 나는 상당히 견고한 해결 방법을 발견했습니다. sortable 초기화의 stop 콜백에서

: 전에 해왔로

stop: function() { 
    $('#timeline').sortable('option', 'items', '.videoBox:not(.isFirst, .isLast)'); 
    opts = $('#timeline').sortable('option'); 
    $('#timeline').sortable('destroy'); 
    $('#timeline').sortable(opts); 
} 

첫 번째 줄은 항목의 옵션을 설정합니다. 그런 다음 sortable 초기화 옵션을 변수에 저장하고 sortable 동작을 삭제하고 올바른 옵션으로 다시 초기화하십시오. 이것은 내가 지금 원하는 것을 수행합니다. 나는 isFirstisLast 항목의 draggable을 파괴합니다. 나는 드래그가 정렬을 통해 결국하지 않는 경우 경우에 필요한 draggable 콜백 정확히 위와 stop 콜백을 떠났다.

약간의 해머 해머 접근 방식처럼 보이지만 더 좋은 방법을 찾기 위해 고심하고 있습니다. 누군가 다른 제안이 있는지 알고 싶으면 관심을 가져라.

관련 문제