带有引导网格的 Jquery Ui 可排序错误答案

【问题标题】：Jquery Ui Sortable bug with bootstrap grid带有引导网格的 Jquery Ui 可排序错误
【发布时间】：2013-07-10 00:24:10
【问题描述】：

这几乎让我打败了。在 jquery ui 中打开占位符选项会导致它仅出现在左上角，如果您在对元素进行排序后查看动画，它会在进入它被放置的位置之前上升到左上角。

$(".widget-row").sortable({
        connectWith:".widget-row",
        helper:"clone",
        revert:true,
        placeholder: "ui-state-highlight",
        opacity:0.5,
         grid: [ 20, 10 ] ,
        start: function(e, ui ){
            ui.placeholder.height(ui.helper.outerHeight());
            ui.placeholder.width(ui.helper.outerWidth());
            //console.log(ui.helper.attr('id'));
        },
        update: function(event, ui){
            arrange_doc();
        }
    });

样本位于Js Fiddle

非常感谢任何帮助。

【问题讨论】：

我认为它的bcoz可排序元素有不同的宽度。真的有必要有不同的宽度吗？
是的，这些项目将成为小部件并且用户可以选择宽度，它工作得非常好，除非我打开 @Arunu 上的占位符选项

标签： jquery jquery-ui twitter-bootstrap jquery-ui-sortable

【解决方案1】：

经过大量研究，我找到了它，给占位符一个引导类，例如 span1-2-3-4... 使它再次正常运行。

Answer 包含解决方案。

【讨论】：