ajax 새로 고침 후 드래그할 수 없습니다

묘사

내 작업에는 반드시 A구역과 B구역이 있어야 한다. A구역은 드래그할 수 있는 요소가 있지만 A구역은 드래그 동작을 받아들이지 않는다. B구역도 일부 요소가 있지만 B구역의 요소는 어느 위치에도 드래그할 수 있지만 A구역으로 드래그할 수 없다. 내가 B구역을 두 번 갱신할 때 aax를 통해 A구역의 요소는 B구역으로 드래그할 수 없고 B구역의 요소는 드래그 동작을 수행할 수 없다(첫 번째 작업만).
다음은 A-존 코드입니다.

$(function(){
        $(".ext_list").sortable({
            group: 'ext-drop',
            drop: false,
            onDragStart: function (item, container, _super) {
                console.log(container, container.options);
                // Duplicate items of the no drop area
                if(!container.options.drop)
                {
                    if(container.el.hasClass('ext_list'))
                    return false;
                    item.clone().insertAfter(item)
                }
                _super(item)
            }
        });
    });

AJAX를 통해 로드된 B-존 코드는 다음과 같습니다.

$(".group_wrap .position_extension_list").each(function(){
            $(this).sortable({
                group: 'ext-drop',
                handle: 'i.icon-move'
            });
        });

토론 #1

aax를 호출할 때 A를 다시 호출해야 한다고 생각합니다. A를 함수로 포장하고 aax에 삽입하면 됩니다.

토론 #2

@karimlahlou가 올바른 길을 걷고 있습니다.플러그 인은 현재 DOM에 로드된 요소에 바인딩되어 있습니다.네가 원하는 행동은 흔하고 나도 같은 제한을 받기 때문에 나는 이 문제를 해결하기 위해 노력할 것이다.
임시 해결 방법(계속 유효)

// Destroy the old sortable
$(".group_wrap .position_extension_list").sortable('destroy')

// after the new DOM nodes are insterted, initialize sortable again
$(".group_wrap .position_extension_list").sortable({ ... })

수동으로 원소를 교체할 필요가 없습니다.sortable 플러그인은 이 점을 실현할 수 있습니다.

토론 #셋

저는 메인 스파에서 비슷한 문제에 부딪혔습니다. 처음에는 모든 것이 좋았지만 만약에 제가 떠나서 페이지로 돌아간다면(페이지가 다시 초기화되든 다시 나타나든) 제 삭제 목표는 소용이 없습니다.내가 드래그한 항목은 내가 추출한 목록으로 되돌아갈 것이다. (이 목록은 삭제할 수 있는 목록이 아니다.)해봤어요.슬프다. 그러나 이것은 나에게 아무런 도움이 되지 않는다.나는 첫 번째 초기화 후에 그것을 실행해서 정렬 가능한 기능을 파괴했는지 보려고 했지만, 모든 것이 정상이었다.
나의 문제를 어떻게 처리해야 하는지에 관한 어떤 건의도 매우 환영을 받는다.

토론 #4

어떤 버전을 사용하십니까?destroy 주 지점에서만 지원되며 아직 발표하지 않았습니다.

토론 #5

0.9.11 - 나는 대사를 복제하고 다시 파괴를 시도했지만, 그것은 여전히 나에게 아무런 작용도 하지 않았다.

토론 #6

에도 같은 문제가 있습니다. 저는 aax 리셋 후sortable 호출을 사용했는데 잘 작동하는 것 같습니다.그러나 이전에 호출된 모든 연결을 없애거나 완전히 해제할 방법이 없기 때문에, 나는 결국 대량의 메모리 문제가 발생할 것이다.0.9.11을 사용해 보았는데 같은 문제가 발견되었다.나도 같은 문제가 있다.파괴해도 소용없다.0.9.11과 마스터를 시도해 보십시오. 원본 코드가 삭제되었습니다.

토론 #7

유성 계획에서도 마찬가지다.
처음에는 괜찮았지만, 만약 내가 다른 페이지를 훑어보고 돌아오면drop이 고장날 것이다.
증상:
-isValidTarget: 컨테이너가 항상 올바르지 않습니다(예: 컨테이너가 정렬 가능으로 초기화되지 않은 경우).
-onDrop: 빈 컨테이너 있음 (null)
- 문제를 해결할 수 없음(6일 전pull request의 최신 버전 사용)
제가 도울 수 있을까요?존니, 콘솔에 고장난 물건을 검사해 보라고요?

토론 #8

디버깅 한동안 후에 문제가 발견된 것 같습니다.
Meteor destroy 템플릿은 나중에 필요하면 다시 렌더링합니다.
템플릿의 정확한 위치에서destroy를 호출하기만 하면 됩니다.내 템플릿.~~ 템플릿에서 정렬 가능한 것을 다시 초기화하기 전에 삭제되었습니다.내 템플릿.렌더링 함수~~
그래서sortable의 버그가 아닙니다.
존니의 플러그인 고맙습니다!

토론 #9

안녕하세요.나도 같은 문제가 있다.몇몇 디버깅을 한 후에, 나는 컨테이너 그룹 중 문제가 발생한 것을 발견했다. 이 그룹은 정리된 적이 없다.다시 그리기/페이지가 바뀔 때마다 용기 그룹의 이름을 변경해서 이 문제를 해결합니다.
연결할 두 개의 정렬 테이블이 있다면 다음은 해결 방법입니다(세 줄의 설명을 보십시오).
var currDate = 새 날짜().getTime();//중요!밀리초 단위의 현재 시간 가져오기
$(sourceEl).슬프다({
그룹: 내 그룹 + currDate//매번 새 그룹을 사용합니다
onDrop: 기능(항목, 컨테이너, 수퍼)
수퍼(프로젝트);
}
});
달러.슬프다({
그룹: 내 그룹 + currDate,//매번 두 정렬표에 같은 새 그룹 사용하기
onDrop: 기능(항목, 컨테이너, 수퍼)
수퍼(프로젝트);
}
});
적어도 나한텐 그랬어.

토론 #10

내 메인 프로그램에도 비슷한 문제가 있다.정상적으로 작동하기 위해서, 우선 프로그램의 전역 대상에 무작위로 생성된 정렬 가능한 그룹 id 문자열을 저장해야 합니다.AJAX가 새로 고칠 때마다, 나는

토론 #11

모든 정렬 가능한 요소를 호출해서, 새로운 정렬 가능한 그룹 id 문자열을 생성한 다음, 새로운 그룹 id 문자열을 사용하여 .sortable('destroy') 모든 정렬 가능한 요소를 다시 호출해야 한다.이것은 해커 프로그램이지만, 현재 새로운 정렬 가능한 라이브러리를 찾는 것보다 훨씬 간단하다.sortable 이런 질문이 있습니다.
나는 n줄이 있는데, 줄마다 n개의 원소를 포함할 수 있다.만약 내가 줄의 보기나 원소가 집합된 보기를 다시 보여 준다면sortable는 이 원소에 더 이상 적용되지 않을 것이다.따라서 변경하거나 다시 렌더링할 때마다 초기화하기 시작했지만 그룹 옵션을 삭제하고 요소를 다른 행에 중첩할 수 없는 경우에만 작동합니다.
업데이트:
같은 그룹의 다른 용기의 후속 실례화는 그룹 옵션을 변경하지 않습니다.
따라서, 나는timestamp이라는 새 그룹을 만들어야 한다. (giobaldac에서 언급한 바와 같이) 아니면, 모든 오래된 정렬표를 없애고 원하는 그룹으로 다시 초기화하는 방법을 찾아야 한다.

토론 #12

고맙습니다. 저도 같은 문제에 부딪혔습니다. 이 복구 프로그램을 사용하면 일을 잘 할 수 있습니다.