Questions tagged [vue.draggable]
50 questions
15
votes
1 answer
Is there a way to expand the Vue.Draggable drop zone to outside the draggable custom tag?
I have a scenario where i have multiple containers with a header, then the list that will be used on vue.draggable and a footer.
I've managed to put the list part working with drag and drop between the multiple containers, but only if i drop them in…

NameNotFoundException
- 151
- 1
- 4
8
votes
2 answers
Vue Draggable - Is there a way to set up a placeholder dropzone/location at the bottom of lists?
I'm working with Vue.Draggable (https://github.com/SortableJS/Vue.Draggable) to create a type of kanban board that allows me to drag items from one list to another. The problem I have is that when I drag a list item to the bottom of another list,…

Chris Mok
- 107
- 5
6
votes
1 answer
vue-draggable not able to disable
I wrote a component that is shared throughout my application, in some places I need the dragging/sorting and some do not want it there. I pass a prop to my component called disableDraggable and based on that it should disable, unfortunately it does…

Michael
- 4,538
- 5
- 31
- 58
4
votes
2 answers
VueJS + Vue.Draggable + Vuex Store + Computed Variables
Is there a way to use Vue.Draggable lists with computed variables in a Vuex Store? I'm fairly new to VueJS and this is my current component setup:
// Template

user2307798
- 67
- 7
4
votes
2 answers
Vuejs draggable sorted list
I'm using Vue.Draggable plugin to implement a draggable list. I'm passing a sorted computed property, like the following:
data(){
return {
paymentMethods: [
{ name: 'stripe', Dindex: 0, state: 2 },
{ name: 'paypal', Dindex: 1 ,…

Yassine Qoraiche
- 1,077
- 14
- 32
4
votes
1 answer
Vue.draggable Get Dragged Item and List ID
I've read all the documentation and stackoverflow I can find, but still am having issues with this.
I'm building a Trello clone with Vue and Rails.
I have many draggable lists.
Each list has draggable cards.
When I drag a card from one list to a…

Elijah Murray
- 2,132
- 5
- 30
- 43
4
votes
1 answer
VueJS: use computed "set/get" with Vue.Draggable and VueX
I'm seeking for a help with "Vue.Draggable".
The second day I`m trying to update draggable array correctly.
The challenge is:
update draggable array using computed set/get functions
get draggable item properties including information about parent…

Vlad Rovner
- 194
- 4
- 11
4
votes
1 answer
Vue.Draggable delete item by dragging into designated region
I've been banging my head against the wall trying to figure this out. I found an example of pretty much exactly what I'm trying to do via the Sortable.js library repo here but I haven't been able to implement it using Vue.Draggable.
My theory of how…

slowFooMovement
- 498
- 5
- 14
3
votes
1 answer
Vue-Draggable & Acts As List - How to update the entire list position?
In my project I've got a Rails API backend where I'm using the acts_as_list gem and Vue frontend where i'm using the Vue Draggable package.
The act of dragging works and I'm seeing a PUT request being sent to my server. There are a couple of…

J. Jackson
- 3,326
- 8
- 34
- 74
3
votes
1 answer
Vue.Draggable Not Moving Component
So I am struggling with a mini page builder I am working on. I have the following code I am working on:
JavaScript/Vue Code: http://git.dannysmc.com/snippets/63 - Also pasted below:
// Import Vue Data
import Vue from 'vue';
import $ from…

Dahknee
- 591
- 3
- 12
- 28
2
votes
1 answer
Vue3 with Vue.draggable-next drag and drop problem
I'm trying to migrate from Vue2 to Vue3 of my project. It's a simple html project with Vue and having drag and drop table. It works fine in vue2 but not in vue3. Getting this error in console : "vue@next:8001 [Vue warn]: Failed to resolve component:…

user3280899
- 199
- 2
- 13
2
votes
0 answers
Styling .sortable-drag element in Vue.Draggable and Sortablejs
I'm trying to style the drag elements according to some validation states.
Here is the jsfiddle I created as an example.
In this example the sortable-ghost class is being styled with a yellow background and a red border but if the element is being…

Vedran
- 177
- 2
- 9
2
votes
1 answer
How can I drag items from list in component to list inside another component using Vue draggable?
I am trying to move items from one list to another using vue draggable, but the lists are inside of a component and I can't get it to work. The items are able to move inside a list but not from a list to another.
I have got a Board component…

Jim
- 23
- 3
2
votes
1 answer
Vue draggable element with a click event on it?
I am making a Tinder clone type app in Vue. I am using the Vue2InteractDraggable component. This component works great for the use case. But I want to have a click event on the draggable portion, which does not fire (because it interprets the click…

mkulak
- 65
- 2
- 4
2
votes
1 answer
vue.draggable dragging wrong element
I'm trying to reorder the colors in a palette using DnD.
Pen is here:
- https://codepen.io/neon22/project/editor/XbqvYe