diff --git a/docs/column-props.md b/docs/column-props.md index ac2b5dc..63e1385 100644 --- a/docs/column-props.md +++ b/docs/column-props.md @@ -16,6 +16,7 @@ Definition of columns props on BootstrapTable * [formatter](#columnformatter-function) * [formatExtraData](#columnformatextradata-any) * [sort](#columnsort-bool) +* [sortValue](#columnsortvalue-function) * [sortFunc](#columnsortfunc-function) * [sortCaret](#columnsortcaret-function) * [onSort](#columnonsort-function) @@ -128,6 +129,40 @@ It's only used for [`column.formatter`](#columnformatter-function), you can defi ## column.sort - [Bool] Enable the column sort via a `true` value given. +## column.sortValue - [Function] +`column.sortValue` only work when `column.sort` enabled. This prop allow you to replace the value when table sorting. + +For example, consider following data: + +```js +const types = ['Cloud Service', 'Message Service', 'Add Service', 'Edit Service', 'Money']; +const data = [{id: 1, type: 2}, {id: 2, type: 1}, {id: 3, type:0}]; +const columns = [{ + dataField: 'id', + text: 'Job ID' +}, { + dataField: 'type', + text: 'Job Type' + sort: true, + formatter: (cell, row) => types[cell] +}] +``` + +In above case, when user try to sort Job Type column which will sort the original value: 0, 1, 2 but we display the type name via [`column.formatter`](#formatter), which will lead confuse because we are sorting by type value instead of type name. So `sortValue` is a way for you to decide what kind of value should be adopted when sorting on a specify column: + +```js +const columns = [{ + dataField: 'id', + text: 'Job ID' +}, { + dataField: 'type', + text: 'Job Type' + sort: true, + formatter: (cell, row) => types[cell], + sortValue: (cell, row) => types[cell] // we use type name to sort. +}] +``` + ## column.sortFunc - [Function] `column.sortFunc` only work when `column.sort` is enable. `sortFunc` allow you to define your sorting algorithm. This callback function accept six arguments: @@ -407,7 +442,7 @@ If the events is not listed above, the callback function will only receive the ` { // omit... headerEvents: { - onClick: e => { ... } + onClick: (e, column, columnIndex) => { ... } } } ``` @@ -535,7 +570,7 @@ This prop also accept a function: { dataField: 'price', text: 'Product Price', - footer: column => column.reduce((acc, item) => acc + item, 0) + footer: (columnData, column, columnIndex) => columnData.reduce((acc, item) => acc + item, 0) } ``` @@ -616,7 +651,7 @@ It's also available to custom via a callback function: { // omit... footerEvents: { - onClick: e => { ... } + onClick: (e, column, columnIndex) => { ... } } } ``` diff --git a/docs/search-props.md b/docs/search-props.md index e52d9d9..5676882 100644 --- a/docs/search-props.md +++ b/docs/search-props.md @@ -11,6 +11,7 @@ Table search in one of features supported by `react-bootstrap-table2-toolkit`. B ## Optional * [searchFormatted](#searchsearchformatted-bool) * [defaultSearch](#searchdefaultSearch-string) +* [onColumnMatch](#searchoncolumnmatch-function) ----- @@ -34,7 +35,7 @@ If you want to search on the formatted data, you are supposed to enable this pro ## search.defaultSearch - [String] Accept a string that will be used for default searching when first time table render. - ```js +```js ``` +## search.onColumnMatch - [Function] +Acccpt a function which will be called when table try to match every cells when search happening. This function accept an object like below example: + +```js +function onColumnMatch({ + searchText, + value, + column, + row +}) { + // implement your custom match logic on every cell value +} + + // ... + +``` + +> Notes: You have to return `true` when your match logic is positive and vice versa. + diff --git a/website/blog/2019-09-08-version-bump.md b/website/blog/2019-09-08-version-bump.md new file mode 100644 index 0000000..5354425 --- /dev/null +++ b/website/blog/2019-09-08-version-bump.md @@ -0,0 +1,30 @@ +--- +title: New Release (2019-09-08) +author: Allen Fang +authorURL: https://twitter.com/allenfang_tw +--- + +## Changed Packages + +We got following packages version bump in this release: + +* `react-bootstrap-table-next@3.2.0` +* `react-bootstrap-table2-editor@1.4.0` +* `react-bootstrap-table2-filter@1.2.0` +* `react-bootstrap-table2-paginator@2.1.0` +* `react-bootstrap-table2-toolkit@2.1.0` + + +## Changelog + +### Bug fixes +N/A + +### Features +N/A + +### Enhancements +* Avoid warning for react legacy lifecycle([`7c8bf00`](https://github.com/react-bootstrap-table/react-bootstrap-table2/pull/1087/commits/7c8bf00cdeb44490de7b4dd0ef9c0ed553e6edd7)) +* Support custom search on cell level([`00b1558`](https://github.com/react-bootstrap-table/react-bootstrap-table2/commit/00b1558df0710267b4c3cb2ce788ac647796d52e)) +* Support `column.sortValue` for custom the sort value of cell([ec1f96c](https://github.com/react-bootstrap-table/react-bootstrap-table2/commit/ec1f96cd1fbac3f08164f6dc922cb41272640e79)) +* Enhance `column.headerEvents` and `column.footerEvents` for adding some useful data([16128e7](https://github.com/react-bootstrap-table/react-bootstrap-table2/commit/16128e77e61329d52f425ce0857731abdad3de28)) \ No newline at end of file