I cannot find any documentation on how to use vue.draggable with bootstrap vue's b-table.
Is there correct way to do this?
Here's my attempt, which literally does nothing:
<dragable v-model="blis" :options="{draggable:'tbody > tr'}">
<b-table :per-page="perPage" :current-page="currentPage" striped hover :items="blis" :fields="fields" :filter="filter" :sort-by.sync="sortBy" :sort-desc.sync="sortDesc" :sort-direction="sortDirection" @filtered="onFiltered">
<template slot="move" slot-scope="row">
<i class="fa fa-arrows-alt"></i>
</template>
<template slot="actions" slot-scope="row">
<!-- We use click.stop here to prevent a 'row-clicked' event from also happening -->
<b-btn :href="'/bli/'+row.item.id" variant="light" size="sm" @click.stop="details(cell.item,cell.index,$event.target)"><i class="fa fa-pencil"></i></b-btn>
<b-btn variant="light" size="sm" @click.stop="details(cell.item,cell.index,$event.target)"><i class="fa fa-trash"></i></b-btn>
</template>
<template slot="priority" slot-scope="row">
<input v-model="row.item.priority" @keyup.enter="row.item.focussed = false; updatePriority(row.item), $emit('update')" @blur="row.item.focussed = false" @focus="row.item.focussed = true" class="form-control" type="number" name="priority" >
</template>
</b-table>
</dragable>
I don't think this migth be possible to use vue.dragggable with bootstrap vue's b-table.
This is not clear what you want to achieve. Where the rows are defined? (I guesss you want to drag the rows). Please add a question on stack-overflow with the vue.draggable tag.
Thanks.
Already made it work, check my question for the answer (for anyone else interested)
https://stackoverflow.com/questions/54670693/draggable-table-with-bootstrap-vue/54683151
Most helpful comment
Already made it work, check my question for the answer (for anyone else interested)
https://stackoverflow.com/questions/54670693/draggable-table-with-bootstrap-vue/54683151