jQuery, различающий несколько идентичных экземпляров селектора - PullRequest
1 голос
/ 21 ноября 2011

У меня есть такой селектор:

$list = $('ul.sortable');

для сортируемого плагина jQueryUI.

На странице есть несколько сортируемых списков.Таким образом, каждый из них выбран, хотя на самом деле отображается только 1, остальные свернуты вместе со свернутым классом.

Когда четные выстрелы позже после перетаскивания, я получаю порядок сортировки первого ul, даже если ясортировка последнего.

Как я могу, когда я на самом деле обрабатываю сортировку позже в функции, выбрать конкретный ul, который: not (.collapsed)?В настоящее время это выглядит так:

$order = $item_list.nestedSortable('toHierarchy');

Редактировать:

Вот что мы имеем при загрузке страницы:

$item_list      = $('ul.sortable');
$url            = 'admin/navigation/order'; // CI Controller to process stuff
$cookie     = 'open_links';
$data_callback  = function(event, ui) {
  // Grab the group id so we can update the right links
  return { 'group' : ui.item.parents('section.box').attr('rel') };
}

// Do sort
sort_tree($item_list, $url, $cookie, $data_callback);

sort_tree в конечном итоге просто делает приведенный выше фрагмент, чтобы получитьпорядок и передает ajax к контроллеру.

Если я изменю селектор выше, все ul не будут применены к ui-плагину и не могут быть отсортированы.Поэтому я понимаю, есть ли способ отличить это от функции sort_tree, и я смогу сделать это правильно.

Вот функция дерева сортировки, с которой я работаю:

sort_tree = function($item_list, $url, $cookie, data_callback, post_sort_callback)
{
    // collapse all ordered lists but the top level
    $item_list.find('ul').children().hide();

    // this gets ran again after drop
    var refresh_tree = function() {

        // add the minus icon to all parent items that now have visible children
        $item_list.parent().find('ul li:has(li:visible)').removeClass().addClass('minus');

        // add the plus icon to all parent items with hidden children
        $item_list.parent().find('ul li:has(li:hidden)').removeClass().addClass('plus');

        // remove the class if the child was removed
        $item_list.parent().find('ul li:not(:has(ul))').removeClass();

        // call the post sort callback
        post_sort_callback && post_sort_callback();
    }
    refresh_tree();

    // set the icons properly on parents restored from cookie
    $($.cookie($cookie)).has('ul').toggleClass('minus plus');

    // show the parents that were open on last visit
    $($.cookie($cookie)).children('ul').children().show();

    // show/hide the children when clicking on an <li>
    $item_list.find('li').live('click', function()
    {
        $(this).children('ul').children().slideToggle('fast');

        $(this).has('ul').toggleClass('minus plus');

        var items = [];

        // get all of the open parents
        $item_list.find('li.minus:visible').each(function(){ items.push('#' + this.id) });

        // save open parents in the cookie
        $.cookie($cookie, items.join(', '), { expires: 1 });

         return false;
    });

    $item_list.nestedSortable({
        disableNesting: 'no-nest',
        forcePlaceholderSize: true,
        handle: 'div',
        helper: 'clone',
        items: 'li',
        opacity: .4,
        placeholder: 'placeholder',
        tabSize: 25,
        listType: 'ul',
        tolerance: 'pointer',
        toleranceElement: '> div',
        stop: function(event, ui) {

            post = {};
            // create the array using the toHierarchy method
            post.order = $item_list.nestedSortable('toHierarchy');

            // pass to third-party devs and let them return data to send along
            if (data_callback) {
                post.data = data_callback(event, ui);
            }

            // refresh the tree icons - needs a timeout to allow nestedSort
            // to remove unused elements before we check for their existence
            setTimeout(refresh_tree, 5);

            $.post(SITE_URL + $url, post );
        }
    });

1 Ответ

2 голосов
/ 21 ноября 2011

Извините, ваш вопрос довольно сложно понять, поэтому мне придется немного угадать.

У вас есть несколько ul на странице, вы сделали их сортируемыми и убедились, что виден только один ul. Позже вы захотите запросить порядок сортировки видимого UL. Я думаю, что первая попытка получить видимый UL была бы такой:

$('ul.sortable:visible')

Из которого вы можете запросить порядок сортировки. Но если вы обрабатываете сортировку, вы, вероятно, знаете одну из li, которая является дочерью ul. Так что вы также можете пойти на

$(li).closest('ul.sortable');

, в котором li является одним из элементов для сортировки, и это также должно получить корневой элемент. Не уверен, что это работает, если вы используете перетаскивание. И, вероятно, сама сортируемая вещь предлагает третий метод (это может быть в методе сортировки?).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...