Filter control clear after selected in table has data-height config

[vuvtdhh]

Bootstraptable version(s) affected

1.22.1

Description

Filter control clear after selected in table has data-height config. Before filter:

After filter selected $1 on Item Price column:

Example(s)

https://live.bootstrap-table.com/code/vuvtdhh/16207

Possible Solutions

I see line 8248. When this.options.height has value. The expression is true and this.resetHeader(); will be called, table header will re-init with initFilterSelectControls function and this function didn't give selected item a selected attribute. I'm not sure what the idea is. Please review this issue.

Update solution I can't find any line in initFilterSelectControls function that set checked attribute for the select option. So, I modified line 4488, I get selected value in filterColumnsPartial property and pass it to addOptionToSelectControl function. After change this line, the table select filter will working fine. File name: bootstrap-table-filter-control.js Line: 4488 After change line 4488, the commented line is the origin.

Additional Context

• Microsoft Edge
• Google Chrome

[robertfshort]

Can confirm this issue still exists in 1.24.1

[yuanjinyong]

still exist in 1.25.0 It maybe a mistake in bootstrap-table-filter-control.js file at 5807 line:

  function cacheValues(that) {
    var searchControls = getSearchControls(that);
    that._valuesFilterControl = [];
    searchControls.each(function () {
      var $field = $(this);
      var fieldClass = escapeID(getElementClass($field));
      if (that.options.height && !that.options.filterControlContainer) {
        $field = that.$el.find(".fixed-table-header .".concat(fieldClass));    // =======> this line
      } else if (that.options.filterControlContainer) {
        $field = $("".concat(that.options.filterControlContainer, " .").concat(fieldClass));
      } else {
        $field = that.$el.find(".".concat(fieldClass));
      }
      that._valuesFilterControl.push({
        field: $field.closest('[data-field]').data('field'),
        value: $field.val(),
        position: getCursorPosition($field.get(0)),
        hasFocus: $field.is(':focus')
      });
    });
  }

change line $field = that.$el.find(".fixed-table-header .".concat(fieldClass)); to $field = that.$tableContainer.find(".fixed-table-header .".concat(fieldClass));

replace $el to $tableContainer, and then work fine.