如果没有容器元素的绑定不能用于可排序 [英] if binding without container element not working for sortable

问题描述

我从rniemeyer修改了一个JSFiddle来说明问题: http://jsfiddle.net/mTqMt/1/

I modified a JSFiddle from rniemeyer to illustrate the problem: http://jsfiddle.net/mTqMt/1/

  <div class="container" data-bind="sortable: groupOrItems">
    <!--ko if: type=='Group'-->
    <div>
      <div class="title" data-bind="text: name()"></div>
      <!--here I would actually have a nested sortable-->
    </div>
    <!--/ko-->
    <!--ko if: type=='Item'-->
    <div class="item" data-bind="text: name()"></div>
    <!--/ko-->
  </div>

Firebug说:knockout-latest.debug.js中的"TypeError:节点为空"行546

Firebug says: "TypeError: node is null" line 546 in knockout-latest.debug.js

我用"foreach"而不是"sortable"进行了尝试，然后它起作用了.

I tried it with "foreach" instead of "sortable" and then it worked.

有什么想法吗?

推荐答案

可排序绑定和jQuery UI可排序确实需要一个父元素来抓住要排序的内容.

The sortable binding and jQuery UI sortable really needs a parent element to grab onto for the stuff that you are sorting.

您可能希望至少将整个项目"包装在一个元素中，例如:

You would want to at least wrap your whole "item" in an element like:

  <div class="container" data-bind="sortable: groupOrItems">
    <div>
      <!--ko if: type=='Group'-->
      <div>
        <div class="title" data-bind="text: name()"></div>
        <!--here I would actually have a nested sortable-->
      </div>
      <!--/ko-->
      <!--ko if: type=='Item'-->
      <div class="item" data-bind="text: name()"></div>
      <!--/ko-->
    </div>
  </div>

已更新: http://jsfiddle.net/rniemeyer/FSYYb/

这篇关于如果没有容器元素的绑定不能用于可排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！