jQuerynestedSortable:防止项目嵌套

发布于 2024-12-12 03:35:40 字数 1577 浏览 0 评论 0原文

我正在使用 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) && 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 && 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 && o.maxLevels != 0) {
      this.beyondMaxLevels = levels - o.maxLevels;
    } else {
      this.beyondMaxLevels = 1;
    }
  }
},

好的,如果我尝试将阶段放入另一个阶段中,则效果很好,但是如果我将其拖得更深一点(即内部一个子组)并放弃它,它只会“爬”上一层。然后我有一个阶段在另一个阶段:-/

阶段应该只是根元素!我希望你有任何想法。

I am using mjsarfattis nestedSortable Plugin to build a hierachical data-structure.
Is there a way to prevent items from being nested? An example:

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

As you can see, (sub-)groups or items can be nested inside the phases but phases themselve should not be nested inside another phase or (sub-)group.

For this case I used the "mustBeRoot" property that handles this function: _isAllowed that had been modified a bit:

_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) && 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 && 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 && o.maxLevels != 0) {
      this.beyondMaxLevels = levels - o.maxLevels;
    } else {
      this.beyondMaxLevels = 1;
    }
  }
},

Ok, this works fine if I try to drop the phase inside another phase, but if I drag it a little deeper (i.e. inside a subgroup) and drop it, it will only "climb" one level up. then I have one phase in another :-/

Phases should be root-elements only! I hope u have any ideas.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

空名 2024-12-19 03:35:40

文档中有一个错误,应该是 disableNestingClass,而不是 disableNesting。希望有帮助。

In the documentation there is an error, instead of disableNesting should be disableNestingClass. Hope that helps.

无名指的心愿 2024-12-19 03:35:40

大卫 - 您应该能够将您不想嵌套的列表项指定为“无嵌套”类。例如:

    <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>

我希望有帮助!

David - You should be able to give the list item you don't want to be nested the class "no-nest". For example:

    <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>

I hope that helps!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文