Closed AlbertReyRuelan closed 1 year ago
@AlbertReyRuelan Did you manage to get this working or change your idea? Was wanting to do something similar
@JackThomas Yep. Implement it like the one below. You need to overwrite the body slot and use v-for to iterate each items
<Vue3EasyDataTable
:rows-per-page="20"
buttons-pagination
:headers="headers"
:items="items"
item-key="name"
>
<template
v-slot:body="props">
<draggable
tag="tbody"
class="table vue3-easy-data-table__body vue3-easy-data-table__body tr[data-v-4d5f5020]"
v-model="modelName"
@end="onDropCallback"
:modelValue="modelNames"
>
<template v-for="(item, key) in items" :key="key">
<tr>
<td></td>
</tr>
</template>
</draggable>
</template>
</Vue3EasyDataTable>
@AlbertReyRuelan Thanks, that helped me get mine up and working!
I want to implement vuedraggable in vue3-easy-data-table. Is it possible to implement ?
It is possible to implement it per items such as this :
But is there any way i can do this with all the items in the row attached? Implementing it outside template doesn't work. Something along like this code wherein we can customize the body prop.
Source of sample code : https://dev.to/andynoir/draggable-table-row-with-vuejs-vuetify-and-sortablejs-1o7l VueDraggable Source : https://sortablejs.github.io/vue.draggable.next/#/table-example