jquery - 使用 jQuery 的甘特图

Question

http://jsfiddle.net/JeaffreyGilbert/VkghS/

当前可以通过拖动 barWrap(灰色)来完成行之间的排序。可以通过拖动甘特栏来移动甘特栏。

我想要的是通过拖动栏可以一次完成排序和移动。如何实现这一目标？

如有任何帮助，我们将不胜感激，谢谢。

Answer 1

可排序小部件具有句柄功能。所以:

$(function() {
    $( ".gantt" ).sortable({
        handle: '.bar' // Make it sortable by dragging the .bar instead of the container
    });
    /*
    $( ".bar" ).draggable({
        connectToSortable: '.gantt',
        containment: '.barWrap',
        grid: [20, 0]
    });
    */
    $( ".bar" ).resizable({
        handles: 'e, w',
        grid: [ 20, 0 ]
    });

    $(".gantt").disableSelection();
});

已编辑(请参阅评论):您必须取出可拖动的内容，在我看来这还不错，因为人们仍然可以使用可调整大小来更改位置。您可以尝试使用可拖动 handle 来找到它们都可以工作的方法。