Kendo ui KendoUI连接可拖动到可排序

是否有任何方法可以连接要添加到KendoUI可排序列表中的KendoUI可拖动项，如jQueryUI的示例：。一天来，我一直在用这个来打击我的脑袋，它变得有点滑稽了。我应该换成jQueryUI吗？

你检查过了吗。它实际上很容易使用

如果这是您的HTML列表元素：

<ul id="sortable">
    <li>Option 1</li>
    <li>Option 2</li>
    <li>Option 3</li>
    <li>Option 4</li>
    <li>Option 5</li>
    <li>Option 6</li>
</ul>

请在此处查看：

使用此默认初始化，您可以使拖动的元素看起来像原始元素（相同的CSS样式），但您可以通过定义

hint

处理程序来更改它：

$("#sortable").kendoSortable({
    hint:function(element) {
        return element.clone().addClass("ob-hint");
    }
});

在这里，我向拖动的元素添加CSS类

ob hint

请参见前面修改的示例：

您还可以通过定义一个向元素甚至文本添加类的处理程序来设置占位符（放置位置）的样式

$("#sortable").kendoSortable({
    hint:function(element) {
        return element.clone().addClass("ob-hint");
    },
    placeholder:function(element) {
        return element.clone().addClass("ob-placeholder").text("drop it here");
    },
});

---

此处修改的示例：

在剑道UI控件中无法执行此操作。Telerik说他们没有这样做的计划，并且有很多借口解释为什么他们不打算这样做

然而，使用一些JavaScript，有一种解决方法。如果将两个列表都设置为可排序，则可以过滤“可拖动”项，这样它们就不会更改位置

$("#draggable").kendoSortable({
   connectWith: "#sortable",    
   start: function () {
     $("#draggable div").each(function () {
       $(this).removeClass("sortable");
     });
   }
});

这把小提琴显示了这一点：

---

唯一的缺点是“可拖动”项会消失，直到您将其放到可排序区域。

您是否知道此组件需要哪个版本的剑道UI？是，最新版本2014.1.318感谢OnaBai提供的示例，但我已经在使用剑道排序表。我关心的是如何将元素从elswhere拖动到剑道排序表中。请看我在jqueryUI中提供的示例，有一个可拖动的connectToSortable选项。。在剑道中没有这样的东西，所以我的问题是如何从页面（获取可拖动的项目并将其副本放入可排序的集合）p.S.剑道版本是最新的。。2天前下载的如果是这样，您可能应该查看一下

kendoDraggable

、

kendoDraggable

和

kendoDropTarget

，但根据页面中元素的组织方式，您也可以使用

kendoSortable

和配置

connectWith

，

过滤器

可能还有

容器

。可以使用JSFIDLE显示元素的结构吗？然后我就可以为那个特定的案例找到最好的解决方案。正如你所看到的，这取决于你的具体要求。我已经在剑道UI反馈网站上请求了这项功能，如果有足够多的人投票支持，他们可能会添加这项功能：你有没有找到解决方案？

$("#draggable").kendoSortable({
   connectWith: "#sortable",    
   start: function () {
     $("#draggable div").each(function () {
       $(this).removeClass("sortable");
     });
   }
});