filterFormatted doesn't work if same dataField is used in more than one column

The main search filter functionality doesn’t work when the same dataField is used twice. In this case, dataField=“locations” is being used twice because I am formatting the data differently afterwards for display and adding ‘filterFormatted’ to the table columns.

Any idea on how to make sure I can search filter properly both the ‘locations’ columns?

Below is the table and the dataFormat functions.

            <BootstrapTable
              data={this.state.chartData}
              hover={true}
              condensed={true}
              pagination={true}
              search
              headerStyle={ { background: '#002699', color: '#ffffff' } }
              multiColumnSearch
              >
              <TableHeaderColumn
                dataField="id"
                isKey={true}
                width="50px"
                dataFormat={ selectFormatter }
                >Select</TableHeaderColumn>
              <TableHeaderColumn
                width="100px"
                dataField="locations"
                filterFormatted
                dataFormat={ nameFormatter }
                dataSort={true}
                >Business Name</TableHeaderColumn>
              <TableHeaderColumn
                width="140px"
                dataField="locations"
                filterFormatted
                dataFormat={ locationsFormatter }
                dataSort={true}
                >Address</TableHeaderColumn>
            </BootstrapTable>

The dataFormatter functions the alter the two ‘locations’ columns

    const locationsFormatter = (cell, row) => {
      if (cell[0]) {
        return `${cell[0].address} ${cell[0].city} ${cell[0].state}`;
      } else {
        return ' ';
      }
    };

    const nameFormatter = (cell, row) => {
      if (cell[0]) {
        const businessName = `${cell[0].name}`;
        console.log('businessName', businessName);
        console.log('businessName', typeof(businessName));

        return businessName;
      } else {
        return ' ';
      }
    };

[Andriy-Kulak]

@AllenFang Yes, I preprocessed the data to appropriate format and fed it into the table so that I don’t have to use dataFormatter. It is not the most efficient way, but I am dealing with relatively small amount of data so it doesn’t affect performance.

[matoelorriaga]

Any update on this? Is this fixed in react-bootstrap-table 2? Thanks!