jquery - 有没有像 drupal 分类术语这样的 jquery 排序插件

标签 jquery jquery-ui drupal jquery-plugins

我喜欢 drupal 分类法中的排序功能,如下所示: http://drupal.org/project/nodeorder 或者如果您已经有在 drupal 7 中编辑分类法的经验。

它提供了类似树/目录的结构排序...

我一直在 jquery ui 和嵌套可排序插件上尝试 2d 排序: http://mjsarfatti.com/sandbox/nestedSortable/

但我对 drupal 中的排序功能很不满意,因为它的表格格式干净且友好。

有人可以给我提供更好的选择吗?我一直在搜索 drupal 存储库,但没有成功

最佳答案

使用 JQuery UI 对表进行排序:

http://jsfiddle.net/bgrins/tzYbU/

您可以应用自己的 CSS 来创建您想要的任何外观和感觉。请注意,这不支持父子关系。

确实支持父子关系的是 JQuery 'treeTable' 插件,位于:https://github.com/ludo/jquery-treetable

这是一个实现treeTable插件的jsFiddle: http://jsfiddle.net/mccannf/Tbd38/10/

使用相当简单的代码:

    $(document).ready(function()  {
        $("#dragndrop").treeTable({
              expandable: false
        });

        // Drag & Drop Code
        $("#dragndrop .entry").draggable({
          helper: "clone",
          opacity: .75,
          refreshPositions: true, // Performance?
          revert: "invalid",
          revertDuration: 300,
          scroll: true
         }
        );

        $("#dragndrop .entry").each(function() {
          $($(this).parents("tr")[0]).droppable({
            drop: function(e, ui) {
              $($(ui.draggable).parents("tr")[0]).appendBranchTo(this);
              setNewParent($($(ui.draggable).parents("tr")[0]).attr("id"), $(this).attr("id"));
            },
            hoverClass: "accept",
            over: function(e, ui) {
              if(this.id != $(ui.draggable.parents("tr")[0]).id && !$(this).is(".expanded")) {
                $(this).expand();
              }
            }
          });
        });

        function setNewParent(child, parent)
        {
            // do ajax call here
            //alert(child);
            //alert(parent);
        }
    });

该插件的主要缺点:

  • 您无法对同一级别的节点重新排序。
  • 您无法将节点直接移动到最顶层。

有时间的人也许可以 fork 该插件并向其中添加这些功能。

关于jquery - 有没有像 drupal 分类术语这样的 jquery 排序插件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12930497/

相关文章:

jquery - 使用 jQuery .tabs() - 内容覆盖页面

jQuery-UI 可拖动和可排序

jquery - 无法让 jquery 工作

java - 单击图像的一部分即可找到匹配的图像

jquery - 从 jqueryui 自动完成组合框中获取选定的值

javascript - 从谷歌可视化类别包装器控件中获取实际值

drupal - 为什么我不能将字段移动到 Drupal 表单中的字段集中 - 无法获取当前值

drupal - 如何使用不同的 drupal 页面模板?

jquery - 选择/单击后导航列表不会折叠(移动/选项卡 View )

jquery - 从 jQuery UI 对话框中的按钮调用动态创建的 iFrame 中的函数