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

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

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

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

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

12
gantt-chart jquery jquery-ui

2 ответов

сортируемый виджет имеет функцию дескриптора. Итак:

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

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

6

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

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

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

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