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…
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
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…
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