diff --git a/packages/react-bootstrap-table2-example/examples/column-filter/custom-text-filter.js b/packages/react-bootstrap-table2-example/examples/column-filter/custom-text-filter.js
index 10e97d8..e4be0a8 100644
--- a/packages/react-bootstrap-table2-example/examples/column-filter/custom-text-filter.js
+++ b/packages/react-bootstrap-table2-example/examples/column-filter/custom-text-filter.js
@@ -13,7 +13,7 @@ const columns = [{
}, {
dataField: 'name',
text: 'Product Name',
- filter: textFilter({ caseSensitive: true })
+ filter: textFilter()
}, {
dataField: 'price',
text: 'Product Price',
@@ -38,7 +38,7 @@ const columns = [{
}, {
dataField: 'name',
text: 'Product Name',
- filter: textFilter({ caseSensitive: true })
+ filter: textFilter()
}, {
dataField: 'price',
text: 'Product Price',
diff --git a/packages/react-bootstrap-table2-example/examples/column-filter/text-filter-caseSensitive.js b/packages/react-bootstrap-table2-example/examples/column-filter/text-filter-caseSensitive.js
new file mode 100644
index 0000000..aa1f421
--- /dev/null
+++ b/packages/react-bootstrap-table2-example/examples/column-filter/text-filter-caseSensitive.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import BootstrapTable from 'react-bootstrap-table-next';
+import filterFactory, { textFilter } from 'react-bootstrap-table2-filter';
+import Code from 'components/common/code-block';
+import { productsGenerator } from 'utils/common';
+
+const products = productsGenerator(8);
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name',
+ filter: textFilter({ caseSensitive: true })
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+const sourceCode = `\
+import BootstrapTable from 'react-bootstrap-table-next';
+import filterFactory, { textFilter } from 'react-bootstrap-table2-filter';
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name',
+ filter: textFilter({ caseSensitive: true })
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+
+`;
+
+export default () => (
+
+
Product Name is case sensitive
+
+ { sourceCode }
+
+);
diff --git a/packages/react-bootstrap-table2-example/stories/index.js b/packages/react-bootstrap-table2-example/stories/index.js
index f4a000a..39b5231 100644
--- a/packages/react-bootstrap-table2-example/stories/index.js
+++ b/packages/react-bootstrap-table2-example/stories/index.js
@@ -37,6 +37,7 @@ import HeaderColumnAttrsTable from 'examples/header-columns/column-attrs-table';
import TextFilter from 'examples/column-filter/text-filter';
import TextFilterWithDefaultValue from 'examples/column-filter/text-filter-default-value';
import TextFilterComparator from 'examples/column-filter/text-filter-eq-comparator';
+import TextFilterCaseSensitive from 'examples/column-filter/text-filter-caseSensitive';
import CustomTextFilter from 'examples/column-filter/custom-text-filter';
import CustomFilterValue from 'examples/column-filter/custom-filter-value';
import SelectFilter from 'examples/column-filter/select-filter';
@@ -146,6 +147,7 @@ storiesOf('Column Filter', module)
.add('Text Filter', () => )
.add('Text Filter with Default Value', () => )
.add('Text Filter with Comparator', () => )
+ .add('Text Filter with Case Sensitive', () => )
// add another filter type example right here.
.add('Select Filter', () => )
.add('Select Filter with Default Value', () => )
diff --git a/packages/react-bootstrap-table2-filter/README.md b/packages/react-bootstrap-table2-filter/README.md
index f98ecc7..07561bf 100644
--- a/packages/react-bootstrap-table2-filter/README.md
+++ b/packages/react-bootstrap-table2-filter/README.md
@@ -59,6 +59,7 @@ const priceFilter = textFilter({
className: 'my-custom-text-filter', // custom classname on input
defaultValue: 'test', // default filtering value
comparator: Comparator.EQ, // default is Comparator.LIKE
+ caseSensitive: true, // default is false, and true will only work when comparator is LIKE
style: { ... }, // your custom styles on input
delay: 1000 // how long will trigger filtering after user typing, default is 500 ms
});
diff --git a/packages/react-bootstrap-table2-filter/src/components/select.js b/packages/react-bootstrap-table2-filter/src/components/select.js
index 0374280..7e17afd 100644
--- a/packages/react-bootstrap-table2-filter/src/components/select.js
+++ b/packages/react-bootstrap-table2-filter/src/components/select.js
@@ -89,6 +89,7 @@ class SelectFilter extends Component {
options,
comparator,
withoutEmptyOption,
+ caseSensitive,
...rest
} = this.props;
@@ -119,14 +120,16 @@ SelectFilter.propTypes = {
style: PropTypes.object,
className: PropTypes.string,
withoutEmptyOption: PropTypes.bool,
- defaultValue: PropTypes.any
+ defaultValue: PropTypes.any,
+ caseSensitive: PropTypes.bool
};
SelectFilter.defaultProps = {
defaultValue: '',
className: '',
withoutEmptyOption: false,
- comparator: EQ
+ comparator: EQ,
+ caseSensitive: true
};
export default SelectFilter;
diff --git a/packages/react-bootstrap-table2-filter/src/filter.js b/packages/react-bootstrap-table2-filter/src/filter.js
index 7ac043e..f166742 100644
--- a/packages/react-bootstrap-table2-filter/src/filter.js
+++ b/packages/react-bootstrap-table2-filter/src/filter.js
@@ -6,7 +6,7 @@ import { LIKE, EQ, NE, GT, GE, LT, LE } from './comparison';
export const filterByText = _ => (
data,
dataField,
- { filterVal, comparator = LIKE, caseSensitive },
+ { filterVal = '', comparator = LIKE, caseSensitive },
customFilterValue
) =>
data.filter((row) => {
@@ -19,9 +19,9 @@ export const filterByText = _ => (
return cellStr === filterVal;
}
if (caseSensitive) {
- return cellStr.toLocaleUpperCase().includes(filterVal.toLocaleUpperCase());
+ return cellStr.includes(filterVal);
}
- return cellStr.includes(filterVal);
+ return cellStr.toLocaleUpperCase().includes(filterVal.toLocaleUpperCase());
});
export const filterByNumber = _ => (
diff --git a/packages/react-bootstrap-table2-filter/test/filter.test.js b/packages/react-bootstrap-table2-filter/test/filter.test.js
index 28be4a5..ae66a38 100644
--- a/packages/react-bootstrap-table2-filter/test/filter.test.js
+++ b/packages/react-bootstrap-table2-filter/test/filter.test.js
@@ -55,6 +55,20 @@ describe('filter', () => {
});
});
+ describe('when caseSensitive is true', () => {
+ it('should returning correct result', () => {
+ currFilters.name = {
+ filterVal: 'NAME',
+ caseSensitive: true,
+ filterType: FILTER_TYPE.TEXT
+ };
+
+ const result = filterFn(currFilters);
+ expect(result).toBeDefined();
+ expect(result).toHaveLength(0);
+ });
+ });
+
describe(`when default comparator is ${EQ}`, () => {
it('should returning correct result', () => {
currFilters.name = {