AllenFang / AllenFang/react-bootstrap-table

Remote CustomFilter with Boolean field or more than one field doesn't pass filter value to onFilterChange properly

オープン
#1,804 コメント 4 件 リアクション 0 件 担当者 0 名 GitHub で見る
主要言語
JavaScript
スター
2.2k
フォーク
761
PR マージ指標
30日以内にマージされた PR はありません

説明

I am trying to put together a custom regex filter that contains the fields:
```javascript
interface CustomRegexValue {
invertFilter: boolean;
regex: string;
}
```

The code in src/Filter.js (quoted below) checks whether the boolean field is "not negative" and that the string field is not empty, and if it is does NOT send the custom filter value through to the remote onFilterChange function.
```javascript
if (value !== null && typeof value === 'object') {
// value of the filter is an object
let hasValue = true;
for (const prop in value) {
if (!value[prop] || value[prop] === '') {
hasValue = false;
break;
}
}
// if one of the object properties is undefined or empty, we remove the filter
if (hasValue) {
this.currentFilter[dataField] = { value: value, type: filterType, props };
} else {
delete this.currentFilter[dataField];
}
} else if (!value || value.trim() === '') {
delete this.currentFilter[dataField];
} else {
this.currentFilter[dataField] = { value: value.trim(), type: filterType, props };
}
this.emit('onFilterChange', this.currentFilter);
```

For a custom filter, the table should not be making any assumptions about the values within the filter when it comes to passing them on to onFilterChange.

This could be fixed by changing the test for 'hasValue' to test for either hasValue OR type is a custom filter:
```javascript
if (value !== null && typeof value === 'object') {
// value of the filter is an object
let hasValue = true;
for (const prop in value) {
if (!value[prop] || value[prop] === '') {
hasValue = false;
break;
}
}
// if one of the object properties is (undefined or empty) and the filter is not a custom filter,
// we remove the filter
if (hasValue || filterType === Const.FILTER_TYPE.CUSTOM) {
this.currentFilter[dataField] = { value: value, type: filterType, props };
} else {
delete this.currentFilter[dataField];
}
} else if (!value || value.trim() === '') {
delete this.currentFilter[dataField];
} else {
this.currentFilter[dataField] = { value: value.trim(), type: filterType, props };
}
this.emit('onFilterChange', this.currentFilter);
}
```

By not sending the values through, I cannot properly re-supply them on the next render either. This means that whatever is set for either invertFilter or regex gets reset by the table sending an empty filter item to onFilterChange due to the checks for 'hasValue' above.

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。