排序后无法打碎

Question

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

目前我们可以将栏杆向左/右拖动。问题是在我们对颜色名称进行排序后，我们无法拖动（不排序）条形图。

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

Answer 1

colornames可排序更新处理程序应包含draggable的重新初始化。问题是你正在添加文件准备就绪的新栏。所以，看起来应该是这样的：

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