Questions tagged [vuedraggable]
The vuedraggable tag has no usage guidance, but it has a tag wiki.
vuedraggable
197
questions
0
votes
0
answers
24
views
can anybody tell me how we can make the q-table rows draggable in quasar
I have tried with vuedraggable package and quasar-ui-q-draggable-table package but it is not working in q-table quasar.
The vuedraggable package is widely used for drag and drop operations in Vue.js ...
- 1
0
votes
1
answer
52
views
Vue draggable not working on b-table, why?
I am using Vue 2 with Bootstrap Vue.
I have a table for which I would like to be able to drag and drop these rows.
But the way I implemented it does not work, but I don't know why.
I am guessing the ...
- 25
0
votes
0
answers
22
views
Incorrect visual representation after transferring all items between groups in VueDraggableNext?
I need to make a wrapper component to sort elements on a page. I took the VueDraggableNext component as a basis. Here is the source code:
https://codesandbox.io/p/devbox/sortable-98v3lk
<template&...
0
votes
1
answer
84
views
Vue Draggable Elements Revert Back to Original Position After Drag and Drop
I'm using vuedraggable in a Vue 3 project to allow reordering of elements within an expansion panel. The elements can be dragged and dropped to a new position within the panel, but they revert back to ...
- 112
0
votes
0
answers
14
views
Vuedraggle is dragged into the specified column, and the name of the group is different. What is the reason?
Vuedraggle is dragged into the specified column, and the name of the group is different. What is the reason?I want to drag from the a list to the specified column, such as c, d
How to implement this ...
- 1
0
votes
0
answers
43
views
<tbody> renders twice when using Vuedraggable in Vueitfy 3
I would like a simple table where I could drag and drop rows to reorder them. The problem I'm having right now is that the tbody is rendered twice, which messes up the layout. I see examples for Vue/...
- 1
0
votes
0
answers
96
views
How can I get relatedContext.element in Vue draggable in nested elements?
This is my ElementsList component:
<template>
<draggable :list="elements" v-bind="dragOptions" :move="handleMove" handle=".handle">
<...
0
votes
0
answers
94
views
Drag and Drop Functionality in Vue.Draggable(SortableJS): Unable to drag items into non-empty groups
I am working with Vue.Draggable and I am trying to create a mechanism that enables drag and drop functionality among different groups of items. My groups of items consist of several md-list-item ...
- 1,087
0
votes
0
answers
59
views
How can I store the expandable position in vue application
I have nested draggable elements in my vue project and for drag event, I am using vue-draggable. So you can imagine my view something similar with this:
--> Element A
--> Element B
--...
- 165
0
votes
0
answers
50
views
how can to revert draggable's initial state
I have nested draggable elements in my vue project and for drag event, I am using vue-draggable. So you can imagine my view something similar with this:
--> Element A
--> Element B
--...
0
votes
0
answers
36
views
Vue draggable Check if Item is already in list and reset to inital state if dropped
I have a parent component which has a child component which is used two times and the Child component uses the Vue draggable library. Now I want to reset the arrays which render the two child ...
- 1
0
votes
0
answers
111
views
How can i drag and drop an item from one v-data-table to another?
I have a parent v-data-table with expandable rows. Each row item has then its own v-data-table.
What I am trying to achieve:
I aim to move an element from a nested v-data-table within one row of the ...
- 43
0
votes
0
answers
108
views
Ant vue Table, Draggable columns
Is there a built-in tool in the Ant Vue Table component for making columns draggable? From my research, it seems there is no such feature available. I attempted to use vuedraggable, but encountered ...
- 13
0
votes
0
answers
161
views
Trouble with Vue3 and vuedraggable: Unable to Drag Elements Between Outermost Layers
I want to drag an element between the outermost elements, but I can't seem to do it successfully. There's only one specific and small spot where I accidentally discovered I can drag it successfully.
...
- 1,675
0
votes
1
answer
168
views
VueJS/Tailwind draggable elements are not resizing the parent or obeying grid rules
I want to break my page into three sections and be able to drag items between each section.
I'm using "vue": "^3.3.0",, "vuedraggable": "^4.1.0",, and "...
- 2,143
4
votes
1
answer
727
views
Vue3 with Draggable - Nesting list - Reactivity
I try to make drag and drop list with Draggable plugin, but depend how i assing new value in watcher from component(second code block) that's responsible of nesting it work only in one way
Codesandbox ...
0
votes
0
answers
50
views
Vue-draggable-next v-for kill the connection with original list
I want to create more groups to move items around from one to another.
Given the following lists and draggable options:
<script setup>
import { computed, ref } from 'vue';
import { ...
- 166
1
vote
2
answers
469
views
what's the type of the Vue.Draggable "change" event?
I'm trying to get the type (in a typescript sense) of a change event from Vue.Draggable
https://github.com/SortableJS/Vue.Draggable
but can't find its definition
the documentation shows that the event ...
- 23
0
votes
0
answers
30
views
How can I make element draggable except the button
I am using vue-draggable for my project. It is something similar like this.
<draggable
v-if="isOpen || (isOpen && isAllOpen)"
v-model="...
0
votes
0
answers
165
views
How can I make vue-draggable element with button
I want to have a draggable element with a button for my vue 2 application. For this, I am using vue-draggable. So something like that in the picture:
So currently, when I click the button (the one ...
0
votes
0
answers
108
views
How can I drag element into another one with vue-draggable
I have nested elements that need to be draggable in between. My problem is at the same level there are elements and when I drag one into another one I want them to have a parent-child relationship but ...
0
votes
0
answers
42
views
How to stop draggable when inside of the draggable clicked
I have draggable and there are nested items inside of it. So it is something like this:
<template>
<draggable v-model="element" :move="handleMove" v-bind="...
1
vote
1
answer
278
views
Vue draggable next get to property of list
Can someone point me to the error I make in this plain simple example.
Want to display the title property but I misinterpreted some docs I guess.
Is there a specific property that should be set to get ...
- 37
0
votes
1
answer
103
views
How to make element parent if the element doesnt have a child in vue draggable
I am trying to use vue-draggable in my project: https://github.com/SortableJS/Vue.Draggable
Here is my ElementsList component:
<div>
<draggable v-model="newElement" :...
2
votes
0
answers
267
views
How to cancel a dragging operation in vuedraggable programmatically
When dragging, if currently dragged element is over a (fixed) non-movable element, it should do some checking to find the closest available element to be swapped with. After that I would like to ...
- 3,885
0
votes
1
answer
55
views
VueDraggable nested lists issue
I would like to use VueDraggable library and create nested lists. So I made a component accodring documentation. Everything works fine till I try to make nested item. I can not. Only if nested list ...
- 4,044
0
votes
1
answer
157
views
Vue3-Draggable - Fetch Object List
I feel i must be very close to gettign this working, all I did was clone the original project from github and change the awway it creates to my own fetch request. When I set it as an array I see my ...
- 503
0
votes
1
answer
667
views
vue drag and drag custom components
I'm trying to make custom components draggable with vuedraggable package but for some reason i can't make it work, i also want it to work by copying not moving the component altogether
here's my code:
...
- 35
0
votes
0
answers
90
views
Erratic behavior trying to reorder array via Drag and Drop in Vue 3 using vue-draggable-next
I'm having trouble rearranging an array using vue-draggable-next to drag and drop items in an array. The array is objects containing song sections, (for example: "Verse 1", "Chorus"...
0
votes
0
answers
70
views
VueDraggable Lock items
I want some of the items to be locked and not be able to move. I saw in the documentation handle prop but this only disable dragging but if some other element which is able to be dragged go over will ...
- 354