Question

我正在尝试将网格中的窗口小部件拖放到一个单独的Div中时将其删除，但是我似乎无法使用网格选项中的“可移动”使其工作。

我浏览过文档（https://github.com/gridstack/gridstack.js/tree/develop/doc）并尝试了其中的其他选项，并尝试复制其中一个具有正常工作功能的演示（http://gridstackjs.com/demo/two.html）寻找也遇到这些问题但找不到任何能够解决此问题的帖子的人。

第一个Div是我要将小部件拖到的位置，第二个是我要将它们拖到的位置。

    <div class = 'trash ui-droppable'>
        <h1 class = 'text-center pt-4'><?= FontAwesome::light('trash'); ?> 
    </h1>
    </div>

    <div class = 'grid-stack mt-3 ui-droppable'>
        <!-- Widgets set here -->
    </div>

这里是设置网格选项的JQuery，我认为应该允许将小部件放入其中的选项是可删除的，并将其设置为Div的第一个类名“ .trash”。

    var options = {
        cellHeight: 100,
        verticalMargin: 10,
        removable: '.trash'
    };
    $('.grid-stack').gridstack(options);

应该发生的是，我将一个小部件拖到顶部Div上，并且应该将其完全从网格中删除，但是当拖动并释放时，就像将其拖出网格并将其放回原处一样是。

Answer 1

我遇到了同样的问题，此问题已通过为垃圾箱div设置一个最小高度（例如75像素）来解决。

当拖动到指定的div时如何删除Gridstack.js小部件

1 个答案: