Пользовательский интерфейс jQuery: разрешить сортировку только на своем родительском уровне, но не выше и не ниже - PullRequest
Новая
       15

Пользовательский интерфейс jQuery: разрешить сортировку только на своем родительском уровне, но не выше и не ниже

8 голосов
/ 04 февраля 2011

В основном, используя структуру списка, я пытаюсь сделать каждую библиотеку доступной на своем уровне, но не на других уровнях. Так что, если я перетащу вниз Number 1, он не будет смешиваться с любым из подчиненных или li, а будет только ниже Number 2. Это то, что у меня есть до сих пор, и хотя это не позволяет литьям подниматься выше своего уровня, это не мешает лиам смешивать НИЖЕ свой уровень. Например, сейчас я могу перемещаться Number 1 между Number 2.1 и Number 2.2

$(".sortable2, .sortable2 ul").sortable({
     opacity: 0.5,
        stop:function(i){
            $.ajax({
                type: "GET",
                url: "?",
                data: $(this).sortable("serialize")
            });
        }
});



$(".sortable2").selectable();
$(".sortable2").disableSelection();


$('.sortable2').bind('mousedown', function(e) {
     e.stopPropagation();
});

Вот структура ul li: 

<ul class="sortable2">
    <li>Number 1
        <ul class="sortable2">
            <li>Number 1.1</li>
            <li>Number 1.2</li>
        </ul>
    <li>
    <li>Number 2
        <ul class="sortable2">
            <li>Number 2.1</li>
            <li>Number 2.2
                <ul class="sortable2">
                    <li>Number 2.2.1</li>
                    <li>Number 2.2.2</li>
                </ul>
            </li>
        </ul>
    <li>
</ul>

1 Ответ

19 голосов
/ 04 февраля 2011

Ваш HTML и селекторы действительно испорчены. Я убрал это для вас здесь. Обратите внимание, что вам нужно определить разные имена классов для разных уровней сортируемых элементов или, по крайней мере, убедиться, что они не возвращаются одним и тем же селектором. Проверьте эту ссылку для фиксированной реализации: http://jsfiddle.net/GMUbj/

Вы также можете настроить селекторы, чтобы вам не приходилось продолжать определять имена классов и вообще избегать всей этой путаницы, как в: http://jsfiddle.net/HWmz3/

Как отмечалось в другом ответе, вы также можете включить или выключить это для отдельных подсписков, используя опцию items, если хотите потрудиться применить класс css ко всем спискам, которые вы хотите отсортировать (обратите внимание, что я оставил класс включенным на большинство пунктов, чтобы вы могли видеть, как это работает): http://jsfiddle.net/DnaBs/

...