Question

我有twitter bootstrap行和列。如果我将行拖入列中，我无法将其拖回。 HTML：

<div class="demo .container-fluid">
<div class="row">
    <span class="drag label label-default">
        <i class="glyphicon glyphicon-move"></i>
            drag
        </span>

    <div class="col-md-12 column">
    </div>
</div>
<div class="row">
    <span class="drag label label-default">
        <i class="glyphicon glyphicon-move"></i>
            drag
    </span>
    <div class="col-md-12 column">
    </div>
</div>
<div class="row">
    <span class="drag label label-default">
        <i class="glyphicon glyphicon-move"></i>
            drag
    </span>
    <div class="col-md-12 column">
    </div>
</div>

这里是javascript：

$(document).ready(function(){
$('.demo, .demo .column').sortable({
    handle: '.drag',
    connectWith: ".column",
    placeholder: "ui-sortable-placeholder",
    start: function(e, ui ){
        ui.placeholder.height(ui.helper.outerHeight());
    },
});
})

小提琴是here。有没有人知道我怎么能这样做，以便在将行拖入列后我可以将其拖回并有三行兄弟姐妹？

Answer 1

解决！只需将.demo添加到connectWith：

$(document).ready(function(){
$('.demo, .demo .column').sortable({
    handle: '.drag',
    connectWith: ".column, .demo",
    placeholder: "ui-sortable-placeholder",
    start: function(e, ui ){
        ui.placeholder.height(ui.helper.outerHeight());
   },
});
})

小提琴：http://jsfiddle.net/1obcs1vc/5/

拖入后无法将孩子拖出父母

1 个答案: