Using vue-tables-2 - I made a prototype with the first column checkboxes and my goal is to:
I was able to create the column of checkboxes, but how can I take the selected rows and push them into a new array in which I can generate a pdf from? I have the method selectRow but am struggling on how to gather all the selected rows and push them into a new array.
<v-server-table url="/removals" :data="tableData" :columns="columns" :options="options">
<input slot="selected" slot-scope="props" type="checkbox" :checked="props.row.selected" @click="selectRow">
<button slot="afterFilter" type="submit" @click="createPdf">Create PDF</button>
</v-server-table>
add checkedRows
to your data object as follow :
data(){
return{
...
checkedRows:[]
}
}
modify your template to this by adding v-model="checkedRows" :value="props.row"
:
<v-server-table url="/removals" :data="tableData" :columns="columns" :options="options">
<input slot="selected" slot-scope="props" type="checkbox" :checked="props.row.selected" v-model="checkedRows" :value="props.row">
<button slot="afterFilter" type="submit" @click="createPdf">Create PDF</button>
</v-server-table>
so in your createPdf
method you are having access to this.checkedRows
methods:{
...
createPdf(){
//do whatever you want with your this.checkedRows
}
...
}