Javascript JQuery UI在手风琴内部可排序时遇到的困难

请参阅JSFIDLE链接，了解我试图构建的UI。首先，用户选择一个会议。选定会议的事件显示在手风琴中，每个事件都有表，这些表在手风琴中以普通html表的形式显示。用户应该能够拖放表并自定义它们的排序顺序。所有这些都是由淘汰赛JS支持的，到目前为止，它的效果非常好，但我遇到了一个障碍

我遇到的第一个问题是手风琴的“数据绑定”。我实现了找到的定制绑定处理程序解决方案，这似乎非常有效。但是，我似乎无法可靠地连接表记录的可排序功能

我不能简单地调用

$（“.sortable tbody”）.sortable（）$（文档）.ready（函数（）{}）中的code>。虽然这适用于第一次会议，但一旦选定的会议更改，可排序功能将丢失。我可以将其添加到手风琴定制活页夹的更新功能中：

update: function (element, valueAccessor) {

            var options = valueAccessor();
            $(element).accordion("destroy")
            $(element).accordion({ active: "h3:last", collapsible: true });

            //TODO: add sortable call here
        }

这似乎有效，但我对定制活页夹还不熟悉。这有效率吗？是否有更好的方法来实现可排序功能

谢谢
 不要担心他们是放置这种逻辑的正确地方

但是，我建议您只为可排序逻辑创建一个新的自定义绑定，因为它与您的手风琴无关：

ko.bindingHandlers.sortable = {
    init: function (element, valueAccessor) {
        var options = valueAccessor() || {};
        $(element).sortable(options);
    }
}

然后，您可以将其用于html：

<tbody data-bind="foreach: Tables, sortable: {}">



演示。
不要担心它们是放置这种逻辑的正确位置

但是，我建议您只为可排序逻辑创建一个新的自定义绑定，因为它与您的手风琴无关：

ko.bindingHandlers.sortable = {
    init: function (element, valueAccessor) {
        var options = valueAccessor() || {};
        $(element).sortable(options);
    }
}

然后，您可以将其用于html：

<tbody data-bind="foreach: Tables, sortable: {}">



演示。
您可能想看看这个项目：您可能想看看这个项目：太棒了！我不知道为什么我会想到手风琴的定制装订。。。正如您提到的，在单独的自定义绑定中进行排序更有意义。效果很好。谢谢完美的我不知道为什么我会想到手风琴的定制装订。。。正如您提到的，在单独的自定义绑定中进行排序更有意义。效果很好。谢谢