case insensitive text filter (#190)

* case insensitive text filter

* optional case insensitive filter
This commit is contained in:
makenova 2018-02-10 00:17:45 -08:00 committed by Allen
parent 024bba15fa
commit 65a596a0e9
4 changed files with 25 additions and 9 deletions

View File

@ -13,7 +13,7 @@ const columns = [{
}, {
dataField: 'name',
text: 'Product Name',
filter: textFilter()
filter: textFilter({ caseSensitive: true })
}, {
dataField: 'price',
text: 'Product Price',
@ -38,7 +38,7 @@ const columns = [{
}, {
dataField: 'name',
text: 'Product Name',
filter: textFilter()
filter: textFilter({ caseSensitive: true })
}, {
dataField: 'price',
text: 'Product Price',

View File

@ -69,7 +69,15 @@ class TextFilter extends Component {
}
render() {
const { placeholder, column: { text }, style, className, onFilter, ...rest } = this.props;
const {
placeholder,
column: { text },
style,
className,
onFilter,
caseSensitive,
...rest
} = this.props;
// stopPropagation for onClick event is try to prevent sort was triggered.
return (
<input
@ -95,12 +103,14 @@ TextFilter.propTypes = {
delay: PropTypes.number,
placeholder: PropTypes.string,
style: PropTypes.object,
className: PropTypes.string
className: PropTypes.string,
caseSensitive: PropTypes.bool
};
TextFilter.defaultProps = {
delay: FILTER_DELAY,
defaultValue: ''
defaultValue: '',
caseSensitive: false
};

View File

@ -6,7 +6,7 @@ import { LIKE, EQ, NE, GT, GE, LT, LE } from './comparison';
export const filterByText = _ => (
data,
dataField,
{ filterVal, comparator = LIKE },
{ filterVal, comparator = LIKE, caseSensitive },
customFilterValue
) =>
data.filter((row) => {
@ -18,7 +18,10 @@ export const filterByText = _ => (
if (comparator === EQ) {
return cellStr === filterVal;
}
return cellStr.indexOf(filterVal) > -1;
if (caseSensitive) {
return cellStr.toLocaleUpperCase().includes(filterVal.toLocaleUpperCase());
}
return cellStr.includes(filterVal);
});
export const filterByNumber = _ => (

View File

@ -49,8 +49,11 @@ export default (Base, {
delete currFilters[dataField];
} else {
// select default comparator is EQ, others are LIKE
const { comparator = (filterType === FILTER_TYPE.SELECT ? EQ : LIKE) } = filter.props;
currFilters[dataField] = { filterVal, filterType, comparator };
const {
comparator = (filterType === FILTER_TYPE.SELECT ? EQ : LIKE),
caseSensitive = false
} = filter.props;
currFilters[dataField] = { filterVal, filterType, comparator, caseSensitive };
}
store.filters = currFilters;