Comment on page
Selectable Rows

This feature is only available on vue-tables-2-premium and v-tables-3
This feature requires a unique id for each row. By default the key is set to id. If you are using a different key use the uniqueKey option to set it
Selectable rows allow you to add a checkbox before each row, thus letting the user select rows. 
In your options object declare it like so:
{
  selectable:{
    mode: 'single', // or 'multiple'
    only: function(row) {
       return true // any condition
    },
    selectAllMode: 'all' // or 'page',
    programmatic: false
  }
}
mode determines whether a single row can be selected or multiple rows
In multiple mode there will be an extra checkbox in the headings row, which is used to toggle all rows in the table. In addition, the user can select multiple rows at once using Shift+Click   
only is an optional callback used to determine which rows are selectable based on the content of the row. The checkbox of non-selectable rows will be disabled
selectAllMode  applies only to multiple select mode on the client component. By default it is set to all, which means that when checking the checkbox on top of the table all filtered rows will be selected. Set to page in order to select only the visible rows on the current page. The above applies to the client table, which has all of the data available. On the server component, only the currently visible dataset will be selected.
programmatic when set to true the plugin will not add the UI for selecting rows (i.e the checkbox/radio button).  In this mode, you handle row selection by listening to the row click event and calling the appropriate method yourself (see Programmatic Manipulation  below) 
Selected rows will have a VueTables__row--selected class, which you can use to style them
Fetching Selected Rows
Currently selected rows can be fetched in two ways:
a. By listening to the select event which will contain the selected subset
b. By fetching the selected rows directly off the table using `ref`: this.$refs.myTable.selectedRows
Programmatic Manipulation
toggleRow(rowId) toggle a row by its unique identifier
selectRow(rowId) select a single row by its unique identifier
selectRows(rowIds) select multiple rows by their unique identifiers
unselectRow(rowId) unselect a single row by its unique identifier
unselectRows(rowIds) unselect multiple rows by their unique identifiers
selectAllRows() select all rows
All of the above methods return the up-to-date selected rows array
resetSelectedRows() reset all selected rows 
Nested Data Structures
Date Columns
Last modified 2yr ago