网格堆栈禁用选定元素上的拖动

问题描述

widget = {
                x: widgetData.XPosition,y: widgetData.YPosition,w: widgetData.Width,h: widgetData.Height,id: widgetData.Id,content: '<div >div1</div><div>div 2</div>'
            };
grid.addWidget(widget);

我正在添加一个像上面一样的小部件，但是，我想在 div 2 上禁用拖动，并在 div 上启用它，了解如何实现这一点，任何帮助将不胜感激。

我正在使用以下选项设置网格

  var options = { // put in gridstack options here
            disableOneColumnMode: true,acceptWidgets: true,// for jfiddle small window size
            float: false,autoposition: true
        };
        grid = GridStack.init(options);

解决方法

    widget = {
                    x: widgetData.XPosition,y: widgetData.YPosition,w: widgetData.Width,h: widgetData.Height,id: widgetData.Id,content: '<div class="someFancyClass">div1</div><div>div 2</div>'
                };
    grid.addWidget(widget);   
 var options = { // put in gridstack options here
            disableOneColumnMode: true,acceptWidgets: true,// for jfiddle small window size
            float: false,autoPosition: true,draggable: {
              handle: '.someFancyClass',scroll: false,appendTo: 'body'
             }
        };   
 grid = GridStack.init(options);

这是通过以上述方式设置网格来解决的

,

试试这个，你需要在初始化你的小部件时设置“noMove”属性。这是根据文档 https://github.com/gridstack/gridstack.js/tree/master/doc#item-options

widget = {
                x: widgetData.XPosition,noMove: true,content: '<div >div1</div><div>div 2</div>'
            };
grid.addWidget(widget);