ugrás a tartalomhoz

Rekurzív drag and drop

Castor87 · 2009. Már. 16. (H), 03.12
Üdv,

A YUI Drag and Drop megoldását szeretném felhasználni menüpontok sorrendjének módosításához. A menüt ul, li-val valósítottam meg, ami bonyolítja a helyzetet, hogy rekurzívan végtelen almenü lehet. Valaki csinált már hasonlót?

Igazából a legszebb az lenne, ha szülő-gyerek között is lehetne dobálni a menüpontokat(a gyerek gyerekeivel együtt), de az is elég lenne ha egy szinten belül lehetne csak mozgatni!

Az a fő problémám hogy nem tudom hogyan válasszam külön egymástól a két ul-t. Valahogy így néz ki:

<ul>
 <li>a</li>
 <li>b</li>
 <li>c
  <ul>
   <li>d</li>
   <li>e</li>
  </ul>
 </li>
</ul>
Jelenleg ott tartok, ha a "c"-t átmozgatom "a" és "b" közé, akkor "c" eltűnik a gyerekeivel együtt.:)
 
1

DOM mozgatás

Poetro · 2009. Már. 16. (H), 13.45
Amit valószínűleg nem jól csinálsz, hogy az átrakott elemet, mint DOM objektum kell átrakni, és akkor a gyermekeivel, tulajdonságaival, ráaggasztott eventekkel együtt át lehet rakni.
Ez egy egyszerű mozgatása a kiválasztott DOM elemnek. Semmi ördőngősség, és valószínűleg rengeteg ilyen példa létezik is YUI-hoz is.
2

Jelengleg így néz ki a kódom,

Castor87 · 2009. Már. 16. (H), 14.24
Jelengleg így néz ki a kódom, csak a két ul egymásba van ágyazva. Van ötleted arra h mit kellene módosítanom ahhoz, hogy egy blokként kezeljen egy ul-t és az ul-on belül lehessen mozgatni a li-ket? Két különálló rész esetén jól működik, bár jó lenne ha egyikből nem lehetne átmozgatni a másikba, viszont egybeágyazás esetén teljesen összeomlik a rendszer.:S Már egy napja googlizok, egy megoldást találtam, de az nem ul-li-t használ, hanem teljesen js, szóval a rengeteg, nem olyan rengeteg.
3

Ilyesmi

Poetro · 2009. Már. 16. (H), 16.07
Mondjuk a kód nincs hozzáigazítva még a HTMLhez, ezért a gyermek mezők még nem drag-elhetők, és nem ismerem a YUIt, hogy tudjam most pontosan hogyan is működik, de valószínű, kis utánjárással meg lehet oldani.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title><!-- Insert your title here --></title>
</head>
<body>
<div class="workarea">
  <h3>List 1</h3>
  <ul id="ul1" class="draglist">
  <li class="list1" id="li1_1">list 1, item 1
  <ul>
    <li class="list1" id="li1_11">list 1, item 1</li>
    <li class="list1" id="li1_12">list 1, item 2</li>
    <li class="list1" id="li1_13">list 1, item 3</li>
  </ul>
  </li>
  <li class="list1" id="li1_2">list 1, item 2</li>
  <li class="list1" id="li1_3">list 1, item 3
  <ul>
    <li class="list1" id="li1_31">list 3, item 1</li>
    <li class="list1" id="li1_32">list 3, item 2</li>
    <li class="list1" id="li1_33">list 3, item 3</li>
  </ul>
  </li>
  </ul>
</div>
</body>
</html>
4

Köszönöm szépen. Működik, de

Castor87 · 2009. Már. 16. (H), 16.24
Köszönöm szépen. Működik, de valóban a gyerekek még nem drag-elhetők.