Jak mogę przeciągnąć z podłączonej listy pionowej do pierwszej pozycji z innej listy poniżej za pomocą jQueryUI Sortable?

Question

Mam kilka UL w pionie w dół strony. Są konfigurowane przy użyciu sortable jQueryUI(). Przykładem jest moja żywo:

http://jsfiddle.net/GVqPF/2/

mogę przeciągnąć z odpowiedziami, aby końcowy element pytań. Ale kiedy przeciągam od pytań do odpowiedzi, symbol zastępczy przeskakuje do drugiego elementu na liście pytań. W tym momencie mogę przeciągnąć go do góry. Ale nie mogę przeciągnąć bezpośrednio do pierwszej pozycji na liście Odpowiedzi.

Here is a video który demonstruje problem.

Jakieś pomysły, dla których mam ten problem, przeciągając z powyższej listy do pierwszego elementu na liście poniżej?

Próbowałem edytować dopełnienie i margines na obu listach i elementach do sortowania.

Dzięki Denis

Answer 1

Po przeciągnięciu LI z jednej listy do podłączonego liście, „pusta przestrzeń” w starej listy zniknie. Powoduje to, że listy pod nią "przesuwają się" na stronie, tak jak kursor dociera do następnej listy. Powoduje to, że przeciągany element unosi się nad 2. przestrzenią zamiast 1., zmuszając Cię do ponownego przesunięcia kursora, aby uzyskać 1. miejsce.

Jeśli twoje listy znajdują się obok siebie poziomo, nie zobaczysz tego problemu (ale, oczywiście, to nie pomoże).

Nie znalazłem jeszcze odpowiedniego rozwiązania, ale mam nadzieję, że pomoże to w rozwiązaniu problemu.

Answer 2

To jest moja obserwacja i prawdopodobne wyjaśnienie tego dziwnego zachowania.

Podczas przenoszenia elementu od pytań pojemnika odpowiedziom pojemnika, zastępczy początkowo dodaje się do końcu odpowiedzi pojemnik przed dalszym ruchem kursora dostaje to między Odpowiedź 1 i answer2.Ideally, to nie powinno się zdarzyć jako zastępczy powinien przeskocz przed odpowiedzią1, a następnie pomiędzy odpowiedzią1 i odpowiedzą2.
* PS: * Ten efekt może nie być widoczny w oknie jsfiddle, ale jeśli tworzysz świeżą stronę HTML z podanym kodem, zobaczysz, co mówię.

Dalsze dochodzenie ujawnia, że ​​istnieje błąd w sortowalnej wtyczce JQuery. Pobierz wersję deweloperską jquery.ui.sortable.js i znajdź tę frazę "var dist = 10000; var itemWithLeastDistance = null". Celem tego fragmentu kodu jest znalezienie najbliższego elementu , gdy kursor przechodzi z jednego kontenera do drugiego.

Obserwuj zmienną "cur" (Dodałem polecenia console.log() dla firebug). Wartością tej zmiennej jest zawsze . Ponieważ wartość zmiennej cur zawsze wynosi "0", kod błędnie oblicza ostatni element jako element "" zLeastDistance "i tam nie trafia.

//When entering a new container, we will find the item with the least distance and append our item near it 
       var dist = 10000; var itemWithLeastDistance = null; var base = this.positionAbs[this.containers[innermostIndex].floating ? 'left' : 'top']; 
       for (var j = this.items.length - 1; j >= 0; j--) { 
        if (!$.ui.contains(this.containers[innermostIndex].element[0], this.items[j].item[0])) continue; 
        var cur = this.items[j][this.containers[innermostIndex].floating ? 'left' : 'top']; 
        //my comments 
        console.log("cur : %s for iteration: %s has base %s", cur, j, base); 
        if (Math.abs(cur - base) < dist) { 
         dist = Math.abs(cur - base); itemWithLeastDistance = this.items[j]; 
         //my comments 
         console.debug(this.items[j]); 
        } 
       } 

Daj mi znać, co społeczność myśli. możemy to zgłosić zespołowi jquery ui.