Сортируемые + вложенные списки с помощью jQuery UI 1.8.2 - PullRequest
25 голосов
/ 22 июля 2010

Этот вопрос на всем протяжении ТАК, но, похоже, ни у кого не было такой же проблемы, как у меня.

Когда я делаю что-то подобное

$(function(){
    $('#unique-ul').sortable({items:'li'});
});

Я бы ожидал«просто работать».По большому счету, это так.Я могу перетащить любой

из любого списка в любой другой список, и любой подсписок этого будет перетащен вместе с ним.

Однако при перетаскивании кажется, что он действительно запутывается в том, где он должен быть.отброшен.Вот пример использования 1.8.0;он отображает то же поведение.

http://jsbin.com/ewuxi3/

Все остальные ответы, которые я нашел по этому поводу, наводят меня на мысль, что это поведение поддерживается пользовательским интерфейсом jQuery;например, здесь есть ошибка, зарегистрированная в 1.7 для вложенных перетаскиваемых объектов: http://dev.jqueryui.com/ticket/4333

Я не могу найти кого-либо еще, у кого была эта проблема, поэтому он говорит, что я делаю это неправильно.Есть какие-нибудь подсказки?

1 Ответ

77 голосов
/ 08 сентября 2010

это происходит потому, что Sortable на самом деле не знает, находитесь ли вы выше вложенного <li> или того, который содержит его. Одним из решений является использование такой структуры:

<ul>
  <li><div>Item 1</div>
    <ul>
      <li><div>Subitem 1</div></li>
      <li><div>Subitem 2</div></li>
    </ul>
  </li>
  <li><div>Item 2</div></li>
  <li><div>Item 3</div></li>
</ul>

и установите опцию toleranceElement: '> div'. Я не знаю, почему это не задокументировано, но оно там и говорит Сортабле, чтобы принять во внимание только <div> при расчете пересечений.

Если вам интересно, я недавно разработал плагин , который упрощает вложенную сортировку, позволяя создавать новые вложенные списки на лету.

...