【问题标题】:Knockout-Sortable horizontal list pushes items vertically when dragging itemsKnockout-Sortable 水平列表在拖动项目时垂直推送项目
【发布时间】:2012-10-30 06:54:38
【问题描述】:

我正在使用 knockout.js 创建一个应用程序,将 knockout-sortable 用于拖放可排序列表。有一个垂直列表,每个项目内部都有一个水平列表。垂直列表表现得很好,但是每当我尝试在水平列表中拖动一个项目时,它会相对于被拖动的项目向上或向下推动该列表中的其余项目。水平列表定义如下:

<div style="float: left" data-bind="sortable: { template: 'levelTmpl', data: $data.levels, beforeMove: $root.verifyMove, afterAdd: showLevel, beforeRemove: hideLevel, options: { containment: 'parent' } }"></div>
<script id="levelTmpl" type="text/html">
    <div class="container item" style="display: inline-block">
    <div style="float: right"><span class="ui-button" data-bind="click: $parent.removeLevel">[x]</span></div>
    <input data-bind="value: name"/><br/>
    <div style="clear: both"></div>
    <textarea cols="35" rows="4" data-bind="value: description"> </textarea><br/>
    <textarea cols="35" rows="4" data-bind="value: canned"> </textarea>
    </div>
</script>

您可以在此处查看完整的应用程序:
链接不再存在

我已经尝试了我找到的所有建议,包括http://bugs.jqueryui.com/ticket/6702 的建议,但到目前为止,没有任何效果。我真的很想让水平可排序列表工作,所以如果有人有任何建议,我将不胜感激。

【问题讨论】:

  • 无法解决这个问题,所以我在ko-js.com/2012/05/part-3-sortable-list-in-knockout-js.html 使用了 Peter Flannery 的解决方案,它根本不使用 Knockout-Sortable。我仍然很想弄清楚为什么这不起作用,所以任何 cmets 都会很棒。
  • 你有没有重现问题的 JSFiddle?
  • 不再。我会看看能不能找到旧版本的代码来制作一个。
  • 我刚刚遇到了类似的问题。创建 JSFiddle 太复杂了,但解决方案是简单地将项目包装在 span 元素中。

标签: javascript knockout.js knockout-sortable


【解决方案1】:

仅供参考https://github.com/rniemeyer/knockout-sortable 只是 jquery ui 的可排序的包装器。

为了不混淆列表,请在可排序元素上使用 connectClass。

【讨论】:

    猜你喜欢
    • 2014-01-23
    • 1970-01-01
    • 1970-01-01
    • 2019-03-24
    • 1970-01-01
    • 1970-01-01
    • 2014-01-15
    • 2020-01-22
    • 1970-01-01
    相关资源
    最近更新 更多