Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] Sortowanie elementów metodą drag & drop
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
grzesiek_g
Witam

Do sortowania elementów metodą drag & drop używam jQuery UI sortable. Świetnie działa to na listach o płaskiej strukturze typu ul > li czy wiersze tabeli. Jednak mam problemy przy rozbudowanej liście z zagnieżdżonymi listami typu: ul li ul li ....
Chcę aby sortowane elementy mogły być przenoszone tylko w obrębie jednego elementu nadrzędnego w tym samym poziomie, np przy strukturze:
Kod
laptopy
    hp
       15''
       17''
    acer
       17''
       15''
telefony
    nokia
        e51
        n95
    samsung

Chcę by możliwe było sortowanie "najgłębiej położonych list", czyli 15'', 17'' w obrębie hp; 15'', 17'' w obrębie acer; e51, n95 w obrębie nokia. A także list: hp i acer w obrębie laptopy i nokia, samsung w obrębie telefony. Również zmiana kolejności list nadrzędnych laptopy i telefony. Z założenia nie wiem ile będzie kategorii, ile będzie poziomów.
A może użyć do tego innego pluginu jQuery?
vokiel
Sprawdzałeś opcje typu: connectWith, containment
grzesiek_g
Wielkie dzięki za pomoc, przeoczyłem opcję containment: parent, jeszcze muszę zobaczyć co nie tak z sortowaniem elementów najwyższego poziomu, ale to chyba tylko kwestia małej zmiany w kodzie HTML.
jacekplacek123
Podłączę się pod pytanie.
Mam taką samą listę:
  1. laptopy
  2. hp
  3. 15''
  4. 17''
  5. acer
  6. 17''
  7. 15''
  8. telefony
  9. nokia
  10. e51
  11. n95
  12. samsung

ale od strony kodu wygląda ona tak:
  1. <p class="wciecie1">laptopy</p>
  2. <p class="wciecie2">hp</p>
  3. <p class="wciecie3">15''</p>
  4. <p class="wciecie3">17''</p>
  5. <p class="wciecie2">acer</p>
  6. <p class="wciecie3">17''</p>
  7. <p class="wciecie3">15''</p>
  8. <p class="wciecie1">telefony</p>
  9. <p class="wciecie2">nokia</p>
  10. <p class="wciecie3">e51</p>
  11. <p class="wciecie3">n95</p>
  12. <p class="wciecie2">samsung</p>


Niestety nie mogę przerobić HTML. W jaki sposób zrobić sortowanie?
niebieszki
Dlaczego nie możesz przerobić html?

Przecież jquery pozwala ci na to bez ingerencji w kod.

Poczytaj sobie o fukncjach append() i html(). Za ich pomocą będziesz mógł dodać znaczniki ul i li za pomocą javascripta a potem już takie samo rozwiązanie jak u grześka.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.