we are using ReactDataGrid old version 5.0.1. since it's in production we cannot update that immediately.
when double click a grid it will go into edit mode. and on typing (
bracket it will open a dropdown
as below. but this is working fine only in ubuntu
.
In windows chrome, only the first cell when typed bracket(
on edit, will open a dropdown. remaining cells when typed
(
it is force closing edit mode
. refer GIF image below.
"react-data-grid": "5.0.1",
"react-data-grid-addons": "5.0.4-2",
handleKeydown = (e) => {
e.stopPropagation()
if (e.key == "(") {
this.setState({ showDropdown: true })
} else if (e.key == ")") {
this.setState({
MDDvalue: [],
showDropdown: false,
})
}
}
<div
onKeyDown={this.stopPropagation}
style={{ pointerEvents: `${isEditable ? "all" : "none"}` }}
className="cell_bg-wrapper">
<input
value={this.state.value}
ref="hybridinput"
onKeyDown={this.handleKeydown}
onChange={(e) => this.handleChangeComplete(e)}
/>
{this.state.showDropdown ? (
<React.Fragment>
<div
onKeyDown={this.stopPropagation}
style={{
width: "100%",
position: "relative",
right: 0,
bottom: 5,
backgroundColor: "white",
color: "black",
}}>
<Select
value={this.state.MDDvalue}
onChange={this.addValue}
options={options}
defaultMenuIsOpen={true}
isMulti={true}
closeMenuOnSelect={!true}
onBlur={this.onBlur}
onKeyDown={this.onKeyDownofSelect}
/>
</div>
</React.Fragment>
) : null}
</div>