Перетаскивание Dojo для «списка в списке» (вложенные списки) - PullRequest
1 голос
/ 20 января 2012

У меня есть следующий HTML, и я использую перетаскивание Dojo для сортировки атрибутов и поместите их в другой раздел. Но как я могу сортировать также разделы? Мне не работает то, что я создал:

<ul accept="section" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">

  <li id="section1" class="dojoDndItem" dndtype="section">
     <ul accept="attribut" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">
       <li dndtype="attribut" id="attribut1"></li>
       <li dndtype="attribut" id="attribut2"></li>
       <li dndtype="attribut" id="attribut3"></li>
     </ul>
  </li>

  <li id="section2" class="dojoDndItem" dndtype="section">
     <ul accept="attribut" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">
       <li dndtype="attribut" id="attribut1"></li>
       <li dndtype="attribut" id="attribut2"></li>
       <li dndtype="attribut" id="attribut3"></li>
     </ul>
  </li>

</ul>

1 Ответ

0 голосов
/ 10 апреля 2012

Это то, что вы хотите сделать: перемещать элементы внутреннего списка между собой в том же списке, а также из списка в список.Вы также хотите переместить два внешних списка.Если это так, попробуйте следующее:

<style>
.container {
  width: 50%;
}
</style>

<ul accept="section" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">
  <li id="section1" class="dojoDndItem" dndtype="section">
     <ul accept="attribut" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">
       <li class="dojoDndItem" dndtype="attribut" id="attribut1">one</li>
       <li class="dojoDndItem" dndtype="attribut" id="attribut2">two</li>
       <li class="dojoDndItem" dndtype="attribut" id="attribut3">three</li>
     </ul>
  </li>

  <li id="section2" class="dojoDndItem" dndtype="section">
     <ul accept="attribut" data-dojo-type="dojo.dnd.Source" class="container dojoDndSource">
       <li class="dojoDndItem" dndtype="attribut" id="attribut4">four</li>
       <li class="dojoDndItem" dndtype="attribut" id="attribut5">five</li>
       <li class="dojoDndItem" dndtype="attribut" id="attribut6">six</li>
     </ul>
  </li>
</ul>

Я сделал следующие изменения:

  • Исправлены дубликаты идентификаторов во втором списке.
  • Установите ширинукласс «контейнер» менее 100%.Это даст вам место, чтобы захватить весь список.Элемент списка
  • Сделал ваши внутренние элементы списка перетаскиваемыми, добавив класс "dojoDndItem".
...