排序后不可拖动

Question

请看：http://jsfiddle.net/JeaffreyGilbert/VkghS/25/

目前我们可以很好地左右拖动条形图。问题是在我们对颜色名称进行排序后，我们无法拖动（而不是排序）条形。

任何帮助将不胜感激，谢谢。

Answer 1

colornames 可排序更新处理程序应包括可拖动对象的重新初始化。问题是您正在添加准备好的文档中不存在的新栏。所以，它应该看起来像这样：

   $( ".colorNames" ).sortable({
        handle: '.handle',
        update : function () {
            var barsOrder = $('.gantt').sortable('serialize');
            var namesOrder = $('.colorNames').sortable('serialize');

            barsTemp = $('<div></div>');

            colorNames = namesOrder.split('&');
            for (i = 0; i < colorNames.length; i++) {
                bar = $('#barWrap_' + (colorNames[i].split("="))[1]);
                barsTemp.append(bar);
            }

            $('.gantt').append(barsTemp.html());
            $( ".bar" ).draggable({
                grid: [ 20, 0 ]
            });
        }
    });