Questions tagged [dragula]

a JavaScript library for convenient drag and drop support

Dragula is a JavaScript library that facilitates usage of drag and drop through an “easiest possible” API. It’s hosted on GitHub where it also provides a demo page. Dragula can easily installed using : npm install dragula --save

See usage details for a comprehensive API overview.

195 questions
24
votes
5 answers

Angular 7: Uncaught ReferenceError: global is not defined when adding package

I am building an Angular 7 app, and when i add a package npm install dragula --save and import this into the pollyfills.ts file i get this error: index.js:2 Uncaught ReferenceError: global is not defined at…
3xGuy
  • 1,364
  • 1
  • 18
  • 35
15
votes
4 answers

Angular 2 Dragula Model updating incorrectly

Working with ng2-dragula. I'm looking to update the orderNumber for every item in a database using the new dropped order. dragulaService.dropModel.subscribe((value) => { var drake = dragulaService.find('bag-orders').drake var models =…
Dan Feinstein
  • 316
  • 1
  • 3
  • 15
15
votes
1 answer

Dragula angular how to access the model item

How do I access the exact model item that was dragged and dropped using the drop-model event? Description of the drop event from the docs: el was dropped into target before a sibling element, and originally came from source el seems to return the…
tinyhamster
  • 169
  • 7
13
votes
1 answer

Using Angular Dragula without RequireJS

I would love to implement Drag and Drop in my Angular project using the angular-dragula module (https://github.com/bevacqua/angular-dragula). However, it seems to be heavily dependent on RequireJS. I've not used Require for a while and only then for…
IAmTimCorey
  • 15,439
  • 5
  • 34
  • 70
9
votes
1 answer

Resolving Ember and Dragula's view of the DOM

I am using Dragula to create a set of drag and drop components in Ember. I pass a list of items through to a parent wrapper that contains multiple droppable buckets. This list of items is filtered initially so that they correct items are rendered in…
RyanHirsch
  • 1,807
  • 1
  • 22
  • 36
8
votes
1 answer

Dragula Figures out sort order - how to disable

I am using Dragula for Drag and Drop functionality. It works until I refresh my list from the server side: this.columnList = newValue; It seams that Dragula wants to preserve order in the list like it was before so it mess up server side sort…
Radenko Zec
  • 7,503
  • 6
  • 32
  • 38
8
votes
1 answer

Using ng2-dragula to drag and swap grid lists

I have a grid of lists and am trying to drag and swap the tiles of the grid with each other using ng2-dragula some.component.html
Arjun
  • 1,189
  • 1
  • 12
  • 24
8
votes
1 answer

Dragula dropping a different element than dragged

In dragula you have a potential one way copy from one container to another - I want to use this for a UI where you drag a symbol representing an element into a container and have it spawn the "Real deal" - real deal being an arbitrary different…
J V
  • 9,736
  • 7
  • 41
  • 64
7
votes
2 answers

How to drag/drop to multiple Angular2 component using ng2-dragula

I have a Angular2 component using ng2-dragula to drag/drop like this: @Component({ selector: 'my-comp', directives: [ Dragula ], viewProviders: [ DragulaService ], template: `
qnreck
  • 73
  • 1
  • 6
7
votes
2 answers

Update array order in Vue.js after DOM change

I have a basic Vue.js object: var playlist = new Vue({ el : '#playlist', data : { entries : [ { title : 'Oh No' }, { title : 'Let it Out' }, { title : 'That\'s Right' }, { title : 'Jump…
Tennyson H
  • 1,667
  • 14
  • 27
6
votes
1 answer

Use dragula to move objects over canvas

I have a canvas with a background picture. I would like to have objects (buttons or divs) that can move over the canvas. I have found the perfect solution with interact.js. The first example on the page (called Dragging) is exactly what I'd like to…
ncohen
  • 6,184
  • 19
  • 61
  • 112
6
votes
1 answer

ng2-dragula [dragula] (angular2 drag and drop) - *ngFor with [dragulaModel] attribute not working

Using ng2-dragula drag and drop wrapper library for angular 2 dragula. https://github.com/valor-software/ng2-dragula Seeing issues with the [dragulaModel]='myList' ... when the item gets dropped ... poof ... it disappears. Inspecting the element, I…
Dan J
  • 229
  • 3
  • 9
6
votes
1 answer

Angular 2: how to conditionally apply attribute directive?

I use drag&drop via ng2-dragula. The drag&drop functionality is applied this way:
item 1
item 2
If I understand angular 2 properly, the way how…
Peter
  • 1,549
  • 2
  • 16
  • 24
6
votes
3 answers

get model by html element in angular2

I need to access the model by the html element in angular2. In my case I use ng2-dragula to perform drag and drop and its service only has access to the html elements that are dragged. And I need to update the corresponding model of the element.…
Yaroslav Yakovlev
  • 5,652
  • 5
  • 35
  • 57
5
votes
1 answer

Dragula :revert drop in ng2-dragula

i have an angular2 app with typescript. I am using ng2-dragula to make a drag and drop application. I am requiered to, check a condition, and revert the drag if the condition is false, and I know from here, that revertOnSpill that revertOnSpill:true…
Jeff
  • 6,026
  • 20
  • 64
  • 108
1
2 3
12 13