Questions tagged [vuedraggable]
The vuedraggable tag has no usage guidance, but it has a tag wiki.
vuedraggable
197
questions
1
vote
3
answers
392
views
keep footer last in list when dragging new item into the list from another
I have Vue Draggable working like a Kanban board with multiple columns, and I have made each column at least the height of the viewport so that each item can easily be dragged into the column next to ...
0
votes
1
answer
475
views
Vue Draggable, mark elements as undraggable?
I've scoured the documentation and the github forum, and I could be mistaken, but as far as I can tell there is no possibility to exclude specific elements from being draggable in Vue Draggable for ...
1
vote
1
answer
897
views
how to enable only one way drag in 2 lists draggable in vuejs
I am using vuedraggable library to create draggable items(https://github.com/SortableJS/Vue.Draggable)
I want to create two draggable lists and I only enable drag from list1 to list2. So I want to ...
0
votes
1
answer
387
views
How to get complete node list of elements from inside vuedraggable template
I'm using vuedraggable (https://github.com/SortableJS/vue.draggable.next) and trying to get a NodeList of all elements rendered inside the draggable component.
The usual Vue3 way would be to use ...
1
vote
0
answers
324
views
Vuetify Draggable Data-table with nested children rows
I have a Vuetify data table with draggable rows. Working well. Here is my code:
<template v-slot:body="props">
<draggable
:list="props.items"
tag="...
0
votes
0
answers
231
views
How to separate data in a v-for with Vue.js 3?
With Vue.js 3 and the draggable package I'm creating a list of grid elements which I want to separate with Category dividers.
Headline 1
---- Grid Elements with Category "headline1"
...
0
votes
1
answer
7k
views
Vue.js 3 Pinia store is only partially reactive. Why?
I'm using Pinia as Store for my Vue 3 application. The problem is that the store reacts on some changes, but ignores others.
The store looks like that:
state: () => {
return {
roles: [],
...
3
votes
2
answers
5k
views
vuedraggable custom component setup in Nuxt3
I'm having a hard time getting vuedraggable (https://github.com/SortableJS/vue.draggable.next) to work in Nuxt 3. Here is the steps I followed so far.
npm install vuedraggable@next
Then created this ...
2
votes
1
answer
1k
views
Vue.Draggable : Use component inside draggable transition-group
I'm having trouble trying to use the Vue.Draggable library. I would like to use a component inside my draggable while keeping the transition-group. It's working without the transition group but ...
2
votes
1
answer
2k
views
How to automatically update "order" field of an item using VueDraggable?
How to update order here after drag and drop?
Currently using Vue3 and
vue draggable( https://github.com/SortableJS/vue.draggable.next).
"items": [
{
"name": "Test ...
0
votes
1
answer
248
views
Adding drag drop functionality in Vue Splitpanes
I am trying to add Drag-drop functionality in Vue Splitpane. I was trying several drag-drop packages i.e. vue-smooth-dnd, Vue.Draggable, etc. But, those dnd packages were conflicting with the ...
0
votes
0
answers
188
views
How to add a click handler with a modifier to vue-draggable (without triggering choose event)
I am trying to implement a click handler on the child of the <draggable> element. I only want the handler to be called if a modifier (alt/ctrl) is used, and I don't want the choose event to be ...
-2
votes
1
answer
393
views
How to add rules to vuetify draggable?
I'm a beginner in vuetify and I made a project where you can add courses to a timetable via vue-draggable. How can I make it possible that I can't drag a course to a certain day because this course ...
1
vote
1
answer
3k
views
Vue Draggable in Draggable and how to get parent's element
i am using vue3 and using vue-draggable.
i had a array:
brand: [
{ id: 0, order: 0 ,name: "Adidas", content:[
{id: 0, order: 0, name:"UK Shoe Size"},
{id: 1, order: ...
1
vote
1
answer
2k
views
Adding item in draggable component in vue3
I am using vue draggable package for my project and here you can see the full component:
<template>
<div>
<button class="btn btn-secondary button" @click="add&...