Vue.draggable: Bootstrap vue b-table

Created on 13 Feb 2019  路  2Comments  路  Source: SortableJS/Vue.Draggable

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>

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

All 2 comments

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

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mathlet0x picture mathlet0x  路  4Comments

Kgwkgwkgw picture Kgwkgwkgw  路  3Comments

tomdong picture tomdong  路  3Comments

Kuohao-wu picture Kuohao-wu  路  3Comments

iou90 picture iou90  路  3Comments