ソースを参照

Fixing issue with filterControlContainer

djhvscf 4 年 前
コミット
903f2b1baf

+ 2 - 18
site/docs/extensions/filter-control.md

@@ -6,8 +6,6 @@ group: extensions
 toc: true
 ---
 
-Dependence if you use the datepicker option: [bootstrap-datepicker](https://github.com/eternicode/bootstrap-datepicker) v1.4.0
-
 ## Usage
 
 {% highlight html %}
@@ -57,18 +55,6 @@ Dependence if you use the datepicker option: [bootstrap-datepicker](https://gith
 
 - **Default:** `undefined`
 
-### disableControlWhenSearch
-
-- **Attribute:** `data-disable-control-when-search`
-
-- **type:** `Boolean`
-
-- **Detail:**
-
-   Set to true if you want to disable the control while the server is responding the data. This options will work if the sidePagination is 'server'.
-
-- **Default:** `false`
-
 ### filterControlContainer
 
 - **Attribute:** `data-filter-control-container`
@@ -140,7 +126,7 @@ Dependence if you use the datepicker option: [bootstrap-datepicker](https://gith
 
 - **Detail:**
 
-   Set `input`: show an input control, `select`: show a select control, `datepicker`: show a datepicker control.
+   Set `input`: show an input control, `select`: show a select control, `datepicker`: show a html5 datepicker control.
 
 - **Default:** `undefined`
 
@@ -202,7 +188,7 @@ Dependence if you use the datepicker option: [bootstrap-datepicker](https://gith
 
 - **Detail:**
 
-   If the datepicker option is set use this option to configure the datepicker with the native options. Use this way: `data-filter-datepicker-options='{"autoclose":true, "clearBtn": true, "todayHighlight": true}'`.
+   If the datepicker option is set use this option to configure the datepicker with the native options. Use this way: `data-filter-datepicker-options='{"property1":value1, "property2": value2, "property3": value3}'`.
 
 - **Default:** `undefined`
 
@@ -215,8 +201,6 @@ Dependence if you use the datepicker option: [bootstrap-datepicker](https://gith
 - **Detail:**
 
    Set the default value of the filter.
-   
-   If you use the datepicker, make sure your date format match the [format](https://bootstrap-datepicker.readthedocs.io/en/stable/options.html?highlight=format#format) of the datepicker. You can change the datepicker format using [filterDatepickerOptions](https://bootstrap-table.com/docs/extensions/filter-control/#filterdatepickeroptions).
 
 - **Default:** `undefined`
 

+ 1 - 5
src/extensions/filter-control/bootstrap-table-filter-control.js

@@ -45,7 +45,6 @@ $.extend($.fn.bootstrapTable.defaults, {
       )
     }
   },
-  disableControlWhenSearch: false,
   searchOnEnterKey: false,
   showFilterControlSwitch: false,
   // internal variables
@@ -148,10 +147,7 @@ $.BootstrapTable = class extends $.BootstrapTable {
           }
           this.$tableLoading.css('top', this.$header.outerHeight() + 1)
         })
-        .on('all.bs.table', (event, name) => {
-          console.log('**********')
-          console.log(`EVENT:: ${name}`)
-          console.log('**********')
+        .on('all.bs.table', () => {
           UtilsFilterControl.syncHeaders(this)
         })
     }

+ 5 - 1
src/extensions/filter-control/utils.js

@@ -118,10 +118,14 @@ export function cacheValues (that) {
   searchControls.each(function () {
     let $field = $(this)
 
-    if (that.options.height) {
+    if (that.options.height && !that.options.filterControlContainer) {
       const fieldClass = getElementClass($field)
 
       $field = $(`.fixed-table-header .${fieldClass}`)
+    } else {
+      const fieldClass = getElementClass($field)
+
+      $field = $(`${that.options.filterControlContainer} .${fieldClass}`)
     }
 
     that.options.valuesFilterControl.push({