Add ArrayFilter to filter multiple values per column

AllenFang · Sep 15, 2017 · 5b32bfd · 5b32bfd
1 parent 13f44ad
commit 5b32bfd
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 2 deletions.
diff --git a/src/BootstrapTable.js b/src/BootstrapTable.js
@@ -67,7 +67,7 @@ class BootstrapTable extends Component {
       }
       if (column.props.isKey) {
         if (keyField) {
-          throw new Error('Error. Multiple key column be detected in TableHeaderColumn.');
+          throw new Error('Error. Multiple key column detected in TableHeaderColumn.');
         }
         keyField = column.props.dataField;
       }
@@ -82,6 +82,7 @@ class BootstrapTable extends Component {
       }
     });
 
+    // if a column filter was created, add 'onFilterChange' listener
     if (this.filter) {
       this.filter.removeAllListeners('onFilterChange');
       this.filter.on('onFilterChange', (currentFilter) => {

diff --git a/src/Const.js b/src/Const.js
@@ -44,7 +44,8 @@ const CONST_VAR = {
     SELECT: 'SelectFilter',
     NUMBER: 'NumberFilter',
     DATE: 'DateFilter',
-    CUSTOM: 'CustomFilter'
+    CUSTOM: 'CustomFilter',
+    ARRAY: 'ArrayFilter'
   },
   FILTER_COND_EQ: 'eq',
   FILTER_COND_LIKE: 'like',

diff --git a/src/store/TableDataStore.js b/src/store/TableDataStore.js
@@ -436,6 +436,14 @@ export class TableDataStore {
     }
   }
 
+  /**
+   * Filter if targetVal is contained in filterVal.
+   */
+  filterArray(targetVal, filterVal) {
+    // case insensitive
+    return filterVal.indexOf(targetVal) > -1;
+  }
+
   /* General search function
    * It will search for the text if the input includes that text;
    */
@@ -488,6 +496,13 @@ export class TableDataStore {
           filterVal = filterObj[key].value;
           break;
         }
+        case Const.FILTER_TYPE.ARRAY: {
+          filterVal = filterObj[key].value;
+          if (!Array.isArray(filterVal)) {
+            throw new Error('Value must be an Array');
+          }
+          break;
+        }
         default: {
           filterVal = filterObj[key].value;
           if (filterVal === undefined) {
@@ -528,6 +543,10 @@ export class TableDataStore {
           valid = this.filterCustom(targetVal, filterVal, filterObj[key].value, cond);
           break;
         }
+        case Const.FILTER_TYPE.ARRAY: {
+          valid = this.filterArray(targetVal, filterVal);
+          break;
+        }
         default: {
           if (filterObj[key].type === Const.FILTER_TYPE.SELECT &&
             filterFormatted && filterFormatted && format) {