Merge pull request #4230 from Falseee/du/feature/issue-3295

Improved the filterBy function with OR condition and custom filter algorythm

site/docs/api/methods.md

@@ -401,11 +401,39 @@ The calling method syntax: `$('#table').bootstrapTable('method', parameter)`.
 
 ## filterBy
 
-- **Parameter:** `params`
-
-- **Detail:**
+- **Parameter:**
+    - `filter - An Object of filter`   
+    Default: `{}`
+    - `options - An Object of options`   
+    Default:
+        ```
+        {
+            'filterAlgorithm': 'and'
+        }
+        ```
+       
+
+- **Detail:**
+  
+  (Can use only in client-side) Filter data in table.   
+  There are multiple ways to filter:
+  - Leave the options blank to use the `and` filter.
+  - Set the `filterAlgorithm` (see at parameter) to `or` to use the `or` filter.
+  - Pass a function to the `filterAlgorithm` (see at parameter) to use a `custom` filter.
+    
+  #####Filter Algorithm
+  
+  - And
+    - Filter `{age: 10}` to show the data only age is equal to 10.  You can also filter with an array of values, as in: `{age: 10, hairColor: ['blue', 'red', 'green']}` to find data where age is equal to 10 and hairColor is either blue, red, or green.
+  - Or
+    - Filter `{age: 10, name: "santa"}` to show all Data which has a age of 10 **or** the name is equals to santa.
+  - Custom
+    - Filter by your Custom algorithm
+    - Function parameters:
+        - Row
+        - Filters
+    - Return `true` to keep the row and return `false` to filter the row.
 
-  (Can use only in client-side) Filter data in table, e.g. you can filter `{age: 10}` to show the data only age is equal to 10.  You can also filter with an array of values, as in: `{age: 10, hairColor: ['blue', 'red', 'green']}` to find data where age is equal to 10 and hairColor is either blue, red, or green.
 
 ## selectPage
 

src/bootstrap-table.js

@@ -435,6 +435,9 @@
     showFullscreen: false,
     smartDisplay: true,
     escape: false,
+    filterOptions: {
+      'filterAlgorithm': 'and' // and means all given filter must match, or means one of the given filter must match
+    },
     idField: undefined,
     selectItemName: 'btSelectItem',
     clickToSelect: false,
@@ -1376,19 +1379,43 @@
         const f = Utils.isEmptyObject(this.filterColumns) ? null : this.filterColumns
 
         // Check filter
-        this.data = f ? this.options.data.filter((item, i) => {
-          for (const key in f) {
-            if (
-              (Array.isArray(f[key]) &&
-              !f[key].includes(item[key])) ||
-              (!Array.isArray(f[key]) &&
-              item[key] !== f[key])
-            ) {
-              return false
+        if (typeof this.filterOptions.filterAlgorithm === 'function') {
+          this.data = this.options.data.filter((item, i) => {
+            return this.filterOptions.filterAlgorithm.apply(null, [item, f])
+          })
+        } else if (typeof this.filterOptions.filterAlgorithm === 'string') {
+          this.data = f ? this.options.data.filter((item, i) => {
+            const filterAlgorithm = this.filterOptions.filterAlgorithm
+            if (filterAlgorithm === 'and') {
+              for (const key in f) {
+                if (
+                  (Array.isArray(f[key]) &&
+                        !f[key].includes(item[key])) ||
+                    (!Array.isArray(f[key]) &&
+                        item[key] !== f[key])
+                ) {
+                  return false
+                }
+              }
+            } else if (filterAlgorithm === 'or') {
+              let match = false
+              for (const key in f) {
+                if (
+                  (Array.isArray(f[key]) &&
+                        f[key].includes(item[key])) ||
+                    (!Array.isArray(f[key]) &&
+                        item[key] === f[key])
+                ) {
+                  match = true
+                }
+              }
+
+              return match
             }
-          }
-          return true
-        }) : this.options.data
+
+            return true
+          }) : this.options.data
+        }
 
         this.data = s ? this.data.filter((item, i) => {
           for (let j = 0; j < this.header.fields.length; j++) {
@@ -1600,10 +1627,6 @@
           to = o.paginationSuccessivelySize
         }
 
-        if (to > this.totalPages) {
-          to = this.totalPages
-        }
-
         if (o.paginationSuccessivelySize > this.totalPages - from) {
           from = from - (o.paginationSuccessivelySize - (this.totalPages - from)) + 1
         }
@@ -3173,7 +3196,8 @@
       this.toggleAllColumns(false)
     }
 
-    filterBy (columns) {
+    filterBy (columns, options) {
+      this.filterOptions = Utils.isEmptyObject(options) ? this.options.filterOptions : $.extend(this.options.filterOptions, options)
       this.filterColumns = Utils.isEmptyObject(columns) ? {} : columns
       this.options.pageNumber = 1
       this.initSearch()