jQuery nestedSortable: запретить вложенность элементов

#jquery #jquery-ui #jquery-plugins #nested-sortable

#jquery #jquery-пользовательский интерфейс #jquery-плагины #вложенный-сортируемый

Вопрос:

Я использую плагин mjsarfattis nestedSortable для построения иерархической структуры данных. Есть ли способ предотвратить вложенность элементов? Пример:

 phase 1
  group
    item
    item
    subgroup
      item
      item
      item
    item
  item
  item
  item
phase 2
  group
    item
    item
    subgroup
      item
    item
  item
  item
  

Как вы можете видеть, (под) группы или элементы могут быть вложены внутри фаз, но сами фазы не должны быть вложены в другую фазу или (под) группу.

Для этого случая я использовал свойство «mustBeRoot», которое обрабатывает эту функцию: _isAllowed, которое было немного изменено:

 _isAllowed: function(parentItem, levels) {
  var o = this.options;
  // Are we trying to nest under a no-nest or are we nesting too deep?
  if (this.currentItem.hasClass(o.mustBeRoot) amp;amp; this._getLevel(this.placeholder) != 0) {
    this.placeholder.removeClass(o.mustBeRoot).addClass(o.errorClass);
    if ( this._getLevel(this.placeholder) == 1) {
      this.placeholder.removeClass(o.errorClass).addClass(o.mustBeRoot);
    }
    this.beyondMaxLevels = 1;
  } else if (parentItem == null || !(parentItem.hasClass(o.disableNesting))) {
    if (o.maxLevels < levels amp;amp; o.maxLevels != 0) {
      this.placeholder.addClass(o.errorClass);
      this.beyondMaxLevels = levels - o.maxLevels;
    } else {
      this.placeholder.removeClass(o.errorClass);
      this.beyondMaxLevels = 0;
    }
  } else {
    this.placeholder.addClass(o.errorClass);
    if (o.maxLevels < levels amp;amp; o.maxLevels != 0) {
      this.beyondMaxLevels = levels - o.maxLevels;
    } else {
      this.beyondMaxLevels = 1;
    }
  }
},
  

Хорошо, это отлично работает, если я попытаюсь переместить фазу внутри другой фазы, но если я перетащу ее немного глубже (т. Е. Внутри подгруппы) и отброшу ее, она будет «подниматься» только на один уровень вверх. затем у меня есть одна фаза в другой :-/

Фазы должны быть только корневыми элементами! Я надеюсь, что у вас есть какие-либо идеи.

Ответ №1:

В документации есть ошибка, вместо disableNesting должно быть disableNestingClass . Надеюсь, это поможет.

Ответ №2:

Дэвид — Вы должны иметь возможность присвоить элементу списка, который вы не хотите, чтобы он был вложенным, класс «no-nest». Например:

     <ul id="your-list">
        <li id="listItem_1"><div>Item 1</div></li>
        <li id="listItem_2" class="no-nest"><div>Item 2 (No-Nesting)</div></li>
        <li id="listItem_3"><div>Item 3</div></li>
        <li id="listItem_5"><div>Item 5</div></li>
    </ul>
  

Я надеюсь, что это поможет!