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:
  1. <ul>  
  2.  <li>a</li>  
  3.  <li>b</li>  
  4.  <li>c  
  5.   <ul>  
  6.    <li>d</li>  
  7.    <li>e</li>  
  8.   </ul>  
  9.  </li>  
  10. </ul>  
Jelenleg ott tartok, ha a "c"-t átmozgatom "a" és "b" közé, akkor "c" eltűnik a gyerekeivel együtt.:)
‹ RSH framework nem működik Google Chrome ban... Középre igazítás IE-ben is, CSS-sel ›
 ■
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.
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
  3. <head>  
  4.   <title><!-- Insert your title here --></title>  
  5. </head>  
  6. <body>  
  7. <div class="workarea">  
  8.   <h3>List 1</h3>  
  9.   <ul id="ul1" class="draglist">  
  10.   <li class="list1" id="li1_1">list 1, item 1  
  11.   <ul>  
  12.     <li class="list1" id="li1_11">list 1, item 1</li>  
  13.     <li class="list1" id="li1_12">list 1, item 2</li>  
  14.     <li class="list1" id="li1_13">list 1, item 3</li>  
  15.   </ul>  
  16.   </li>  
  17.   <li class="list1" id="li1_2">list 1, item 2</li>  
  18.   <li class="list1" id="li1_3">list 1, item 3  
  19.   <ul>  
  20.     <li class="list1" id="li1_31">list 3, item 1</li>  
  21.     <li class="list1" id="li1_32">list 3, item 2</li>  
  22.     <li class="list1" id="li1_33">list 3, item 3</li>  
  23.   </ul>  
  24.   </li>  
  25.   </ul>  
  26. </div>  
  27. </body>  
  28. </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.