Диаграмма Ганта с JQuery

Question

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

В настоящее время сортировка между рядами может быть сделано путем перетаскивания barWrap (серый). Перемещение полосы gantt можно выполнить, перетащив планку.

Я хочу, чтобы сортировка и перемещение выполнялись сразу, перетаскивая панель. Как достичь этого?

Любая помощь будет оценена, спасибо.

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(); 
}); 

Edited (см комментарий): Вы должны вывезти перетаскиваемым, что ИМО не так уж плохо, потому что люди могут по-прежнему использовать изменяемыми, чтобы изменить положение. Вы можете экспериментировать с перетаскиваемыми ручками, чтобы найти метод, в котором они работают.

Answer 2

Это старый вопрос, но вам просто нужно добавить еще один Div обертку для достижения этого (jsfiddle):

$(function() { 
    $('.barWrap').wrapInner('<div class="sorter"></div>'); 
    $(".gantt").sortable({ 
     handle: '.sorter' 
    }); 

    $(".bar").resizable({ 
     handles: 'e, w', 
     grid: [ 20, 0 ] 
    }); 

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