expand by column: expandable={false} not working while column is custom format

[sxhuan]

click the cell with button or badge still can expand the row

settingFormatter(cell, row){
    return (
      <span>
        <Button role='button' className="btn btn-outline-info" onClick={() => this.props.loadOffSideBar(true, ACT_TYPE_EDIT, row.id, row.name, row.text)} ><FontAwesome name='pencil' /></Button>
        <Button role='button' className="btn btn-outline-danger ml-3" onClick={() => this.props.deleteEvent(row)} ><FontAwesome name='times' /></Button>
      </span>
    );
  }
  statusFormatter(cell, row){
    return (
      <span>
        {row.isPublish ?
          <Badge color='success' className="p-2">Published</Badge>:
          <Badge color='warning' className="p-2">Draft</Badge>
        }
      </span>
    );
  }
<TableHeaderColumn dataField="status" dataAlign="center" expandable={ false } dataFormat={this.statusFormatter}>
                Status
              </TableHeaderColumn>
              <TableHeaderColumn dataField="setting" dataAlign="center" expandable={ false } dataFormat={this.settingFormatter}>
                {this.renderCustomHeader()}
              </TableHeaderColumn>

[AllenFang]

@StanleySong, sorry, do you configure options.expandBy as column?

[sxhuan]

yes, i did

[AllenFang]

@StanleySong sorry, the expandable={ false } still work well with dataFormat, could you please show me your entire example to minimal repo? Or did you forgot to tell me some configuration? thanks

[Fenicio]

Hi, I just reproduced this error and found out why it's happening.

In TableRow, on the rowClick method, when it's attempting to get the cellIndex (Line 16 as of now) if the dataFormat adds another html tag, a div, a span or whatever, when it tries to find the cellIndex is going to return undefined.

One possible solution would be to loop back through the .parentNode of the e.target to get the first td element, and then get the cellIndex of that.

[AllenFang]

@Fenicio nice catch 👍 But for your PR https://github.com/AllenFang/react-bootstrap-table/pull/1622/files a while loop is seems like to danger, but I'll keep to find another better solution, thanks

[sxhuan]

@AllenFang @Fenicio Thank you guys, good job. sorry for looking into it late