问题标签 [nested-sortable]

我正在使用 jQuery nestedsortable 插件对 ul 列表进行排序。但有时我需要禁用和启用它。使用 ui 可排序很容易，但找不到使用嵌套列表的方法。

我尝试使用：

但是没有办法再次启用它。感谢帮助。

更新： 分析插件源代码有帮助。

将完全破坏嵌套的可排序实例。

我正在尝试在 jQuery DataTable 和 jQuery nestedSortable 之间拖动。问题是，当我放下可拖动对象（从 DataTable 中）时，它会恢复为表格行，而不是 li 对象（以适应嵌套排序表）。一个示例 jsFiddle 在这里。我的理想场景就像这个jQuery UI 示例，但源是数据表，目标是嵌套排序...

我通过为可拖动插件创建自己的“connectWith”选项找到了此修复程序来连接两个元素，因此我可以从表中拖放到可排序中。

我还想出了如何使用自定义助手使占位符看起来好像是一个 li 对象，但我不知道如何让放置对象等于助手，而不是原始表行. 我尝试过在 .draggable(stop)、.nestedSortable(stop) 和 .nestedSortable(receive) 事件中玩东西，但没有运气。有人可以指出我正确的方向吗？我在文档中遗漏了什么吗？

谢谢！祝所有真正阅读本文的人节日快乐...

我的基本代码：

更新

我知道有很多关于如何在 jQuery 中更改可拖动对象的线程，所以只是为了记录一些我尝试过的东西（没有奏效）：

附加到可排序的停止方法，并带有一个标记已删除项目的自定义类。

使用可排序的更新事件：

同时使用 droppable 和 nestedSortable（这会留下重影，但它确实会丢弃看起来像 li 的东西......可能在正确的方向）：

我使用该toArray函数通过这行代码获取列表。

如何使用此数组重建列表？

我们正在尝试 Angular-NestedSortable https://github.com/subvertnormality/Angular-NestedSortable（angular-ui-tree 的第 2 版看起来还不稳定，看看测试）。
我们想通过 REST 加载树结构，然后折叠根节点。
此外，我们希望在展开项目时发出额外的 REST 请求。我们遇到了问题，因为 NestedSortable 使用了很多嵌套的 Angular 作用域，而且我们不了解如何访问诸如 collapseAll() 之类的 API 方法或如何重载 toggle()。
有人可以提供一个示例小提琴或 plunkr 左右吗？
那是行不通的： $scope.list = [...]; $scope.collapseAll(); 因为collapseAll没有在外部范围内定义......

Using Ember and Handlebars I'm trying to display an ordered list of notes with nested sublists of notes (using jquery nestedSortable, and rails gem awesome_nested_set). I have my notes in the correct order, and each note has a parent_id in the database and in Ember Data.

Basically, the handlebars template should loop through each note, and then loop through each sub-note within that note.

To do this correctly I have a feeling I need a nested 'children' array, but I'm not fully certain whether that's true, or the best way to do that. Computed properties? Handlebars Helpers? Any advice would be awesome.

Updates

I received a tip that I'll try and work with:

Then in the template, for each node, just render its (children) “notes” :

Saving on every drag and drop is another part to this puzzle, but one step at a time...

我正在使用 angular-ui-tree 制作具有记分卡节点层次结构的记分卡应用程序。我的记分卡节点通过 Web 服务层保持不变，并有自己的 ID 号来识别它们。

为了按 ID 使用记分卡节点，我实现了以下方法：

这里的细节不是很重要，只是说这个方法会爬取构成树的嵌套范围，直到它找到 $modelValue（我的记分卡节点状态）具有我们正在寻找的 ID 的范围。它工作得很好，除非我做这样的事情：

注意“then”函数中的两行。我要求我的服务创建一个新节点，当我得到它时，我将它推入作为模型一部分的数组中。我希望我新插入的节点立即切换到“编辑”模式（其中显示了其中的一些表单控件。）但是在推送之后立即调用 getNodeScopeByNodeID 失败。如果我调试它，看起来范围还没有赶上模型。我的节点数组（模型）中的节点比我期望的子范围多一个。

我想我只需要给 Angular 一个机会来对模型更改做出反应，然后再开始通过范围寻找我正在寻找的东西。我怎么做？

我已经红了我能找到的任何东西。但一切都没有改变。我正在将新项目添加到列表中，但无法将其移动到可排序容器中。页面加载附带的元素很好，它们是可移动的。如何让它发生。

我把它变红了-> nestedsortable 动态项不折叠

我无法使 func "nextId" 起作用....

我是什么小姐。

坦斯克

编辑 3： 只是总结一下变成了一个相当长的问题，希望有人会发现它更容易理解它的要点并能够更容易地提供帮助：

我想要的是让下面的jsfiddle＃2（在EDIT 2下）工作，因为它应该在选择和拖动时正确地将多个项目放在正确的位置。

原始问题：

我试图弄清楚如何让 nestedSortable 允许选择多个项目。我无法通过谷歌搜索在任何地方找到有关它的任何信息，我自己也无法弄清楚。

如果有人知道如何做到这一点，那就太好了。我一直将其视为如何使用多个项目进行拖放的示例-这本身就很难找到！

jsfiddle #1，通过拖放进行多选，但仅限于平面元素结构：http: //jsfiddle.net/2n9xkmg3/

这里的主要 jQuery 代码：

我在另一个堆栈溢出问题的评论中找到了该示例的建议：

如何使用 JavaScript 或 jQuery 一次拖动多个元素？

那么我怎样才能让这个多选在nestedSortable 插件中工作呢？

有关该插件的信息，请参阅https://github.com/ilikenwf/nestedSortable。

基本上我想要实现的是在 Web 应用程序中拖放项目（如文件和文件夹，但也可能是其他东西），类似于 DropBox 和 Google Drive 在他们的网络中多次拖放文件和文件夹接口。

除了......我需要这个嵌套，就像在nestedSortable插件中一样。

由于很多网站都有这样的功能，我几乎认为会有一个现成的解决方案，但事实证明，即使是对多个项目的平面结构拖放，也很难找到答案，更不用说与嵌套结构相结合。但是在各种网站上也有很多这样的例子，我只是不知道如何实现它。

非常感谢任何帮助！

编辑：添加了上面插件的链接。

编辑2：

我觉得这个问题需要一个更清晰的例子才能在这个问题上获得帮助。所以我自己创建了一个完整的 jsfiddle。

这个采用了上面提到的 jsfiddle，然后我尝试创建一个新的，基于 nestedSortable 插件示例文件：https ://github.com/ilikenwf/nestedSortable/blob/2.0alpha/example.html

这是我的新jsfiddle：

jsfiddle #2，在嵌套结构中通过拖放尝试多选：

http://jsfiddle.net/anderszvensson/w141dLLt/1/

我从嵌套可排序列表的示例开始。然后我尝试合并来自 jsfiddle #1 的多选（仅处理平面结构的多选拖放）。

到目前为止，我合并的部分只是元素.selected上的 toggleClass <li>，还为选择 an 时添加了边框<li>，以及helper选项。

这确实使它部分起作用，但不是完全起作用。也就是说，拖动多个元素表明它确实将所有选定的元素都带入了拖动中。

但是，仍然只有一个元素被丢弃/接收。我无法让它实际移动/放下拖动中的所有元素。

我希望这会有所帮助，以便比我更擅长 jQuery 的人能够弄清楚如何使多个元素的拖放在这个 nestedSortable 插件中工作。

为清楚起见，这是来自 jsfiddle #2 的代码（我自己的尝试）：

HTML：

JS：

CSS：

I have a tree structure that I'm trying to sort with a jQuery nestedSortable plugin.

Here you can see my code and a working example:

You can move nodes around the tree, so that's working fine. Unfortunately, I'm not able to get a response array so I can update my database values.

If you check the browser console while moving around those tiny little node things, you can see that I constantly get the error:

"Uncaught TypeError: Cannot read property 'match' of undefined".

What could be the reason of this error and, equally important, how can I get an array after a tree adjustment?

我正在使用一个名为nestedSortable对列表的顺序进行排序的插件，并将 ( ul li) 嵌套到数据库 mySQL。

但是，使用此插件更改后，我无法保存订单。我之前使用过 sortable 插件，它会在更改时将订单保存到数据库中，但没有嵌套选项。

HTML 代码：

jQuery代码：

PHP代码：

每当我使用插件 jQuery sortable 时，将更改的订单保存到数据库中都没有问题：

谁能帮我解决这个问题？我不擅长解释事情，如果解释得不好，请见谅。