问题标签 [sortables]

我在 jquery 中使用 sortable 函数对常见问题列表进行排序。不用说，我对这个概念很陌生。任何人都有这方面的后端很好的例子。我的前端工作正常，但更新数据库中的序列是另一回事。顺便说一句，我的后端是 ColdFusion。

提前致谢

解释起来可能有点复杂。我有一个包含 9 个 100 x 100 像素的图像的网格（每个数字代表一张图片）：

我想要的是用户可以拖放，例如 9 比 1，他们改变这样的地方：

来自 jquery UI 的 sortables 将不起作用，因为他们的解决方案是使用浮点数。这会将所有框“推”到右边或左边，例如：

提前致谢。

下面的代码没有完全禁用 start 事件的 sortables。它会将类ui-sortable-disabled和可排序元素添加ui-state-disabled到可排序元素中，但不会禁用该功能 - 换句话说，可排序元素看起来已禁用，但它们仍然接受拖动的项目并表现得像已启用。

我想这样做的原因是在拖动开始时是因为我可能需要禁用已经包含被拖动项目的其他连接的可排序对象（为了简化，我去掉了逻辑）。这是一个错误还是有解决方法？

Sortables当列表项水平显示时，我在使用类对列表项进行排序时遇到问题。删除此样式修复了所有问题：

display: inline

在 jsfiddle 上创建了一个示例。

这行得通。检查样式表.countries li- 它不显示内联列表 - http://jsfiddle.net/Wgpqw/

这不能正常工作。我可以在列表中拖动列表项，但是在移动时随机发生排序 - http://jsfiddle.net/Wgpqw/1/

我怀疑它与内联模式下的列表元素定位有关。任何帮助是极大的赞赏。

我正在尝试使用 jQuery UI Sortable 构建一个可排序的导航树。我让它在 Firefox 中运行良好，没有任何问题。在 IE 中它工作得很好，但是，当尝试将具有嵌套列表的项目向下移动到其导航层时，似乎存在一些不一致的问题。该列表不会扩展为正在运行的列表创建放置点，并且它经常失败，但是，有时排序仍然有效。我玩这个的时间比我愿意承认的要长！有没有人有任何想法？

这是一个带有 source 的演示的链接。

重复问题：在 IE 中将行（移动显示项目 12）向上拖动几行，然后尝试将其移回开始的位置。（注意：要移动项目，您必须单击并按住移动）

对不起，回来了

我怎样才能得到“最后一个”可排序的项目。我正在从一个列表 2 中拖动另一个列表，但我需要/想要将“长度”附加到最后一个拖动的项目，这可能不是“已删除”列表中的最后一个项目 - 希望您理解。

一些代码的想法

我有一个用很棒的 awesome_nested 集制作的类别模型。我已经成功地生成了拖放树，并使用 SERIALIZELIST 插件成功地生成了该树的完整哈希，并将其发送到我添加到类别控制器中的“数组”方法。（使用jquery和nestedsortables）我的日志中的哈希看起来像这样......

处理 CategoriesController#array (for 127.0.0.1 at 2010-08-19 23:12:18) [POST] 参数：{"ul"=>{"0"=>{"class"=>"", "id" =>"category_1", "children"=>{"0"=>{"class"=>"", "id"=>"category_4", "children"=>{"0"=>{"class" =>"", "id"=>"category_3"}}}}}, "1"=>​​{"class"=>"", "id"=>"category_2", "children"=>{"0 "=>{"class"=>"", "id"=>"category_5"}, "1"=>​​{"class"=>"", "id"=>"category_6"}}}}}

我只是在使用排序功能时遇到了麻烦。

很棒的嵌套集确实提供了一些移动功能，但我似乎无法理解它。

当用户点击保存时，我想做这样的事情（顺便说一句，它执行 ajax 请求并正确传递上述数据）

我希望这是足够的信息，并希望有人可以回答这个问题。

干杯，

马特尼亚

------------ 更新和进展 ------------

自从几天前发布此内容以来，我在我的开发环境中使用 logger.info 来查看幕后发生的事情。

我最终写了2个函数。一个遍历数组的根，另一个递归地将孩子和孩子的孩子移动到位。但这最终会导致太多的数据库调用（尽管可能没有其他方法可以做到）。

代码看起来像这样......

我希望有人可以阐明如何提高效率以及如何减少数据库调用的数量。我曾考虑过编写其他函数，但它们都会做同样的事情。

对于这个特定的项目，我不相信会有超过 100 个不同的类别。这不是最好的方法，但它确实有效。

再次欢呼，

马特尼亚

最后的解决方法

我对上面的代码有一个问题，它没有正确地保存孩子。这是我最近的尝试，似乎效果很好。

仍然有太多的数据库调用，但我想这是想要这个功能所要付出的代价，因为它需要重新记录数据库中的每个项目。

希望这可以帮助其他有需要的人。如果有人需要这方面的帮助，请随时给我发信息。

真棒嵌套集 + JQUERY 拖放 + SERIALIZELIST 插件....

干杯，

马特尼亚

我很沮丧和沮丧，所以是时候寻求帮助了。做了很多谷歌搜索，但还没有找到适合我的解决方案。

我所拥有的是一大堆可以使用 Jquery 可排序的 div，其中一些 div 包含一个 TinyMCE 实例。在您尝试移动包含 TinyMCE 实例的 div 之前，这一切都很好 - 当您这样做时，TinyMCE 似乎会刷新自身并创建一个新实例，因此您会丢失数据等。然后整个页面因 javascript 而中断不再作品:)。在此期间，我在 Firebug 中遇到 javascript 构造函数错误等。

我决定最好的方法是当 div 开始被拖动时，从文本区域中删除 tinymce，当它被放置在它的新位置时，将 tinymce 重新插入。

我可以很好地删除它，但在重新添加它时遇到了麻烦——因为我遇到了更多的构造函数错误。

注意：TinyMCE 会自动添加到我正在使用的系统中的所有文本区域，因此尽量避免弄乱 TinyMCE。

在下面的代码中，我只是针对特定的 textarea id 进行测试。

还有其他人有其他解决方案吗？如果您需要更多信息，请告诉我:)

这里奇怪的问题。

使用使用 TinyMCE 作为文本编辑器的现有系统。

我创建了一个页面，其中包含大量使用 jquery 可排序的可移动 div。现在 TinyMCE 似乎不喜欢在 dom 中移动，所以在做了一些研究之后，看来我必须从被移动的 div 内的文本框中删除 tinymce 实例，并在拖动结束时将其重新添加。我可以很好地删除实例，但是当我重新添加它时，它不会。

我有最新版本的 TinyMCE，一个稍旧的 jQuery 版本（尝试更新但没有运气）。

无法解决这个问题，因此这篇文章:)

不知道为什么它不会加回来，有什么想法吗？

嗨，人们正在使用 UI 来进行拖放，问题是我无法启动“克隆”。

我有 2 个<ul><li></li></ul>列表，我想从列表 1 拖动到列表 2 好的，这很容易，但是让“克隆”保留在列表 1 中却不是。我需要/想要发生的是从列表 1 拖动到列表 2（仅单向拖动），然后在列表 2 中接收隐藏删除拖动的项目 - 好的听起来很奇怪，但拖动项目的 ID 加载基于该的页面ID 进入<li>第 2 次创建的“空”<ul>

到目前为止，“我们”看起来像这样：

请提出建议-谢谢