问题标签 [dragula]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2168 浏览

javascript - Dragula - 将元素从一个容器拖到不同的元素

我的问题与 Dragula 有关https://github.com/bevacqua/dragula

我试图从一个容器中拖动元素并将它们(复制而不是移动)放到不同的容器中。因此,通过这种方式,我有一个容器,其中包含要拖动的元素,我想将它们放入不同的容器中,但它无法正常工作,有时甚至根本无法工作。请指导我的代码有什么问题。

HTML

jQuery

您的建议将不胜感激。

谢谢你。

0 投票
1 回答
713 浏览

php - 使用dragula js拖放项目时如何获取项目ID和目标父ID(容器ID)

我正在使用 Dragula JavaScript 来动态附加容器项。当我拖放时,我想获取目标父ID和项目ID。我已经附上了相同的图像。一旦我得到这些 id,我想将它们存储在数据库中。我正在使用 PHP 和 AJAX。

拖放图像

0 投票
0 回答
558 浏览

javascript - Dragula Angular2使用可观察更新值

我正在使用Angular2和ng2-dragula(基于dragula)编写一个树控件。我目前正在使用与此处的示例嵌套重复示例非常相似的东西。我在列表中加载并按预期进行拖放没有问题。我需要做的是单击一个按钮,返回 http 服务获取新数据,然后更新页面上的数据。我知道我可以使用 javascript 来查找 id 并以这种方式进行更新,但这似乎不是处理它的正确方法。

这是我的组件代码 - 所有这些只是重写视图数据并完全撤消任何更改的拖动等(我确定这是设计使然)。我尝试了很多不同的方式来使用 dragulaModel,但是无论发生什么,整个组件都会重新渲染。我需要能够更新子文本

我是角度新手,想确保我遵循正确的模式

编辑 如果我添加一个 .subscribeloadItems()然后this.items手动更新它就像我想要的那样工作this.items[0].children[0].text = "1000"reloadItems()我应该以这种方式手动更新整个对象吗?看起来像一个黑客

**编辑 2 ** 我设法通过订阅 loadItems() 然后比较 reloadItems 中的 2 个对象,然后在那里进行任何必要的更改来使其工作。我认为由于订阅它是自动更新的。任何人都可以确认我是否做错/正确(在这里工作 plnkr ,忽略角度依赖)

0 投票
1 回答
2495 浏览

html - 如何使用 Dragula for Angular 2 使某些 div 元素不可拖动

我已经能够成功地ng2-dragula与我的项目集成,但我仍然无法弄清楚如何制作一些 div non draggable

我曾尝试为 div使用一些css以及 html ,但没有成功。draggable="false"似乎无论我放什么,dragula 都会在之后插入它的指令并覆盖所有内容。也许我错了……

有谁知道如何实现这一目标?

例如:

我怎样才能使divwith class donotdrag不可拖动?

0 投票
0 回答
668 浏览

api - Aurelia Dragula 如何使用 Api 而不是自定义元素

我正在尝试使用 aurelia dragula。我能找到的所有示例都使用自定义元素

然后让 div 像这样充当源/目标

效果很好,我可以看到我可以为拖动端添加其他函数绑定等。但是文档显示了 Dragula 可以侦听的一堆事件,但看起来我必须使用 API,而不是自定义元素,以利用这些元素。我似乎无法弄清楚如何在视图中使用 Dragula 对象以及上面的 div。例如...

不会从上面的 div 中获取拖动事件。

我对 aurelia 很陌生,所以也许我错过了一些与框架相关的东西?如何使用 Dragula API 方法而不是自定义元素?

谢谢

0 投票
3 回答
813 浏览

angular - Angular2/Ionic2 + ng2-dragula 有人让它工作吗?

我试图将拖放添加到我的 ionic 2 应用程序中。但不能让它工作。

这是我到目前为止所做的:

然后在我的页面中:

但是当我添加 [dragula] 标签时,出现错误:无法绑定“dragula”,因为它不是已知的原生属性。

有没有人让它与 ionic 2 一起使用,有没有例子?

0 投票
0 回答
77 浏览

angular - 访问悬停在不是袋子上的元素?Dragula 和 Angular 2

我有 2 个 Dragula 袋,我想将元素从 1 个袋子拖到另一个袋子,并且第二个袋子中的元素不应该受到影响或移动我只是想知道哪个元素悬停在第二个袋子中。而不是包名。

这可能吗?我正在使用 Ng2-Dragula。

我目前正在使用内置函数,但是除了包之外,没有任何悬停在上面的元素的参数。

0 投票
1 回答
2707 浏览

javascript - 修改我的视图后如何再次初始化dragula

我使用此代码在页面加载时初始化 Dragula。在我通过将一个小容器拖放到另一个容器中来修改我的视图后,这个小容器没有我在我的 Dragula 中指定的功能。刷新网页后,小容器功能正常。在修改视图而不需要刷新网页后,我应该如何让我的 Dragula 正常工作?

0 投票
0 回答
920 浏览

javascript - 使用 Leaflet 和 Dragula 的可拖动弹出项目

我正在使用Dragula在我正在使用的应用程序中拖放项目。动态添加的可拖动项目在任何地方都可以使用,除了在Leaflet地图弹出窗口中,我不知道为什么。

这是我想要工作的一个小例子;我的弹出窗口会引入动态内容,并且弹出窗口中的项目将能够被拖到地图之外的某个地方。

http://jsfiddle.net/d2pkmfcj/

如何从弹出窗口中获取“项目 1”和“项目 2”进行拖动?

编辑:更新了小提琴以演示 Dragula 实例的功能。您可以将项目拖入弹出窗口,但不能拖出。这似乎与 Leaflet 限制 DOM 事件有关。

0 投票
2 回答
2310 浏览

javascript - 使用dragula javascript获取丢弃的div的ID

我正在尝试使用 Dragula.js 拖放来更新 c3.js 图表,但我不知道如何获取拖入新容器的 div 的 id。我的html是这样的:

我正在使用 dragula.js 拖放:

我对 jquery 真的很陌生,但是在这个问题<div>之后,为了访问放入的 id,collapse2我试图做这样的事情:

但没有结果。任何帮助将非常感激