jQuery UI Взаимодействие сортируемых и перетаскиваемых списков не работает - PullRequest
1 голос
/ 13 мая 2011

У меня есть инструмент для отслеживания рецептов для игроков World of Warcraft: http://www.wowgeeks.com/tracker.php?item=recipes. У меня есть три пользовательских списка: список «Есть», список «Необходимость» и список оригинальных предметов на выбор.от.У меня есть последний список как перетаскиваемый, с connectToSortable, установленным для класса, который разделяют первые два списка.

HTML для трех списков:

<div class="sub-third">
    <h1>My Recipes</h1>
    <div class="tracker-list sortable" id="have-list">
    </div>
</div>
<div class="sub-third">
    <h1 style="color: #f90;">Recipes I Need</h1>
    <div class="tracker-list sortable" id="need-list">
    </div>
</div>
<div class="sub-third">
    <h1 style="color: #eee;">Add Recipes</h1>
    <div class="tracker-list" id="add-list">
        <div class="tracker-item" id="itemid_123">
            <a class="tracker-icon" rel="item=43509"><img class="wow-icon" src="/images/icons/small/inv_scroll_03.jpg" alt="Icon" /></a>
            <p>Bad Clams</p>
        </div>
        <!-- ETC... -->
    </div>
</div>

А вотJavaScript для перетаскиваемых / сортируемых:

$(function() {
    $('#add-list .tracker-item').draggable({
        connectToSortable   : '.sortable',
        helper              : 'clone'
    });

    $('#have-list, #need-list').sortable({
        connectWith : '.tracker-list',
        cursor      : 'move',
        revert      : true,
        placeholder : 'ui-state-highlight',
        update      : function() {
            var order = $(this).sortable('serialize');
            order += '&userid=1&itemtype=Recipes&charid=0';
            //alert(order);
        }
    });

    $('.tracker-list, .tracker-item').disableSelection(); // So dragging doesn't accidentally select any text

    $('#have-list, #need-list').sortable('refresh'); // Refresh the lists
});

По какой-то причине после того, как я перетаскиваю элемент из 3-го списка в 1-й список один или два раза, он неожиданно отказывается сотрудничать.Элементы в 3-м списке внезапно становятся не перетаскиваемыми.Но перетаскивание элементов из 3-го списка во 2-й работает очень хорошоВы можете попробовать ссылку выше и проверить это для себя.Кто-нибудь может сказать мне, в чем может быть проблема?

1 Ответ

1 голос
/ 13 мая 2011
$('#add-list .tracker-item').draggable({
    connectToSortable   : '.target-list',

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

...