Вложенные сортируемые элементы, глубина блокировки - PullRequest
Новая
       2

Вложенные сортируемые элементы, глубина блокировки

0 голосов
/ 23 июня 2011

Я с трудом пытаюсь «зафиксировать» глубину вложенных сортируемых элементов, чтобы они могли сортировать только «вверх и вниз» среди своих прямых братьев и сестер.

Я думал, что у меня это с этим, но я все еще могу 'вытянуть' дочерние элементы из их родителей и наоборот. 

var $sort = $( '#outside-wrapper' ).sortable({

    axis  : 'y',
    items : '.item',
    start : function( event, ui ) {
        // dynamically set the containment to the item's direct parent once started
        $sort.sortable( 'option', 'containment', ui.item[0].parentNode );
    }

});

Вот пример требований к разметке; 

<div class="item">

    <div class="item"><!-- content --></div>

    <div class="item">

        <div class="item"><!-- content --></div>

        <div class="item">

            <div class="item"><!-- content --></div>    

        </div>

    </div>

</div>

Цените любые указатели!

Ответы [ 2 ]

0 голосов
/ 12 февраля 2014

Я собираюсь добавить ответ, даже если он помечен как отвеченный:

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

<div class="items">
    <div class="one"> x </div>
    <div class="one"> x </div>
    <div class="one"> 
        <div class="items">
            <div class="one"> x </div>
            <div class="one"> x </div>
            <div class="one"> x </div>
        </div>
    </div>
</div>

В коде выше это будет работать: 

$('div.items, div.items').sortable({/* ... */});

Я нашел эту скрипку с похожим кодом: http://jsfiddle.net/GMUbj/184/

0 голосов
/ 23 июня 2011

Ну, большое спасибо благодаря jQuery UI: разрешить сортировку только в пределах своего родительского уровня, но не выше или ниже .

Окончательный результат: 

sort.call( $( '#outside-wrapper' )[0] );

function sort() {
    $( this )
        .sortable( 'destroy' )
        .sortable({ items : '> .item' })
        .find( '> .item' )
        .each( sort );
}

Там уничтожение, так как мне приходилось перепривязывать всякий раз, когда я добавлял в DOM.Кажется немного рекурсивно интенсивным, но, как говорится ... это работает.

ОБНОВЛЕНИЕ: IE (7 & 8) снаряд рвота.Казалось, событие перетаскивания поднималось вверх, и все родительские узлы уходили вместе с ним, перемещаясь экспоненциально на расстоянии друг от друга ...

Да, приятно на это смотреть.Не моя чашка чая, хотя.Исправлено с помощью handler: '> .handler' т.е. не используйте сортируемый объект в качестве обработчика!

...