diff --git a/src/components/table/README.md b/src/components/table/README.md index 2b0be8d8261..62fcd655116 100644 --- a/src/components/table/README.md +++ b/src/components/table/README.md @@ -1070,11 +1070,13 @@ footer cells that do not have an explicit scoped slot provided. The slots can be optionally scoped (`data` in the above example), and will have the following properties: -| Property | Type | Description | -| -------- | ------ | ------------------------------------------------------------- | -| `column` | String | The fields's `key` value | -| `field` | Object | the field's object (from the `fields` prop) | -| `label` | String | The fields label value (also available as `data.field.label`) | +| Property | Type | Description | +| --------------- | ------ | ----------------------------------------------------------------------------------------- | +| `column` | String | The fields's `key` value | +| `field` | Object | the field's object (from the `fields` prop) | +| `label` | String | The fields label value (also available as `data.field.label`) | +| `selectAllRows` | Method | Select all rows (applicable if the table is in [`selectable`](#row-select-support) mode | +| `clearSelected` | Method | Unselect all rows (applicable if the table is in [`selectable`](#row-select-support) mode | When placing inputs, buttons, selects or links within a `HEAD[...]` or `FOOT[...]` slot, note that `head-clicked` event will not be emitted when the input, select, textarea is clicked (unless they @@ -1138,10 +1140,12 @@ rather than native browser table child elements. Slot `thead-top` can be optionally scoped, receiving an object with the following properties: -| Property | Type | Description | -| --------- | ------ | ----------------------------------------------------------------------------- | -| `columns` | Number | The number of columns in the rendered table | -| `fields` | Array | Array of field definition objects (normalized to the array of objects format) | +| Property | Type | Description | +| --------------- | ------ | ----------------------------------------------------------------------------------------- | +| `columns` | Number | The number of columns in the rendered table | +| `fields` | Array | Array of field definition objects (normalized to the array of objects format) | +| `selectAllRows` | Method | Select all rows (applicable if the table is in [`selectable`](#row-select-support) mode | +| `clearSelected` | Method | Unselect all rows (applicable if the table is in [`selectable`](#row-select-support) mode | ## Custom empty and emptyfiltered rendering via slots diff --git a/src/components/table/helpers/mixin-thead.js b/src/components/table/helpers/mixin-thead.js index 4996d3fd2bd..564f2e9ab32 100644 --- a/src/components/table/helpers/mixin-thead.js +++ b/src/components/table/helpers/mixin-thead.js @@ -55,6 +55,10 @@ export default { return h() } + // Refernce to `selectAllRows` and `clearSelected()`, if table is Selectable + const selectAllRows = this.isSelectable ? this.selectAllRows : () => {} + const clearSelected = this.isSelectable ? this.clearSelected : () => {} + // Helper function to generate a field cell const makeCell = (field, colIndex) => { let ariaLabel = null @@ -116,7 +120,10 @@ export default { label: field.label, column: field.key, field, - isFoot + isFoot, + // Add in row select methods + selectAllRows, + clearSelected }) if (!slot) { // need to check if this will work @@ -135,7 +142,10 @@ export default { } else { const scope = { columns: fields.length, - fields: fields + fields: fields, + // Add in row select methods + selectAllRows, + clearSelected } $trs.push(this.normalizeSlot('thead-top', scope) || h()) $trs.push(h(BTr, { class: this.theadTrClass }, $cells))