Slyweb
На разработку сайта! Скидки 50%!

Сортировка вложенных списков

Спрашивайте здесь о jQuery UI.

Сортировка вложенных списков

Сообщение Mary » 10 окт 2009, 19:53

Подскажите пожалуйста. Вот у меня есть вложенный список типа
Код: Выделить всё
<ul>
   <li>test
   <ul>
      <li>test1<ul></ul></li>
      <li>test1<ul></ul></li>
      <li>test1<ul></ul></li>
   </ul>
   </li>
   <li>test2<ul></ul></li>
</ul>

для его сортировки использую js-код:
Код: Выделить всё
$('ul').sortable({
   connectWith: 'ul',
   dropOnEmpty: true,
   placeholder: 'ui-state-highlight',
   forcePlaceholderSize: true,
   scroll: true
});

В итоге сортировка, понятно, работает, сортируются пункты списка, есть возможность перетащить пункт списка первого уровня во второй, все замечательно. А вот обратно - никак. Т. е. test1 я не могу перетащить и поставить после test2 на одном с ним уровне, если пытаюсь тащить, то он почему-то становится только потомком test2. Есть мысли, как это исправить? Я уже все параметры sortable перебрала, ничего не помогает :cry:
Mary
 

Re: Сортировка вложенных списков

Сообщение admin » 22 окт 2009, 18:28

Список вложенный в элемент другого списка вызывает трудности, при перемещении его элементов внутри родительского списка, поскольку для того чтобы списки могли принимать элементы другого списка необходимо пересечение границ списка, иначе sortable не будет вести себя так как Вам нужно. По крайней мере я не встречал решение данного недостатка. Возможно Вам будет удобно использовать следующую структуру.
Код: Выделить всё
<script type="text/javascript">
jQuery(document).ready(function(){

$("#sortable1, #sortable2, #sortable3").sortable({
         connectWith: '.connectedSortable',
         dropOnEmpty: true
});

});
</script>

<ul id="sortable1" class="connectedSortable">
   <li>Item 1</li>
   <li>Item 2
<ul id="sortable2">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
   <li>Item 5</li>
</ul>

</li>
   <li>Item 3</li>
   <li>Item 4</li>
   <li>Item 5</li>
</ul>

<ul id="sortable3" class="connectedSortable">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
   <li>Item 5</li>
</ul>
admin
Администратор
 
Сообщения: 165
Зарегистрирован: 15 авг 2009, 20:02

Re: Сортировка вложенных списков

Сообщение SerzN1 » 22 июл 2010, 12:24

решение такое
важен только класс sortable

Код: Выделить всё


$(".sortable").sortable({
   connectWith: '.sortable',
   dropOnEmpty: true
});

<ul id="sitemap" class="sortable">
            <li id="id1_1"><a href='/about/'>О микрорайоне</a><span class="ui-icon ui-icon-search"></span><span class="ui-icon ui-icon ui-icon-gear"></span><span class="ui-icon ui-icon-cancel"></span><span class="ui-icon ui-icon-trash"></span>
               <ul class="sortable">
                  <li id="id11_1"><a href='/about/arch/'>Архитектура</a></li>
                  <li id="id11_2"><a href='/about/infra/'>Инфраструктура</a></li>
                  <li id="id11_3"><a href='/about/place/'>Местоположение</a></li>
                  <li id="id11_4"><a href='/about/ingeneer/'>Инженерия и Инновации</a></li>
                  <li id="id11_5"><a href='/about/Documents/'>Документы</a></li>
               </ul>
            </li>
            <li id="id1_2"><a href='/genplan/' class='sel'>Генплан</a>
               <ul class="sortable">
                  <li id="id21_5"><a href='/genplan/Types/'>Типы домов</a></li>
               </ul>
            </li>
            <li id="id1_3"><a href='/gallery/'>Фотогалерея</a></li>
            <li id="id1_4"><a href='/Members/'>Участники Проекта</a></li>
            <li id="id1_5"><a href='/sale/'>Условия продаж</a></li>
            <li id="id1_6"><a href='/contacts/'>Контакты</a></li>
         </ul>



для полного счастья придется дописывать в каждый элемент пустой список чтобы можно было в него поместить перетаскиваемые строчки
пока что нормально "serialize" не проходит так что придется делать подругому
SerzN1
 
Сообщения: 1
Зарегистрирован: 22 июл 2010, 12:12


Вернуться в Вопросы по jQuery UI

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 0

cron