[SOLVED] Datagrid Cell Editor, on keypress handle

[kifni41]

Hi,

Is there any way to catch onKeypress from cell editor. I want to end the datagrid by pressing enter, and may be another function like tab for switching to the next editor.

Code:

<GridColumn key='inikey3' title="DESCRIPTION" field="description" rowspan="2"  width="300px"
     editable
     editor={({ row }) => (
          <TextBox
              ref={this.textInput}
              value={row.description}
              onKeyPress={this.handleKeyHere.bind(this)}
          ></TextBox>
 )}
></GridColumn>

//we want to to like this
handleKeyHere(event) {
  if(event.keyCode === 13) {
    this.datagrid.endEdit();
  }
}

Thanks.

[jarry]

Please wrap the TextBox component with a new element and bind the keydown event on it. Please look at this code.

Code:

<GridColumn field="name" title="Name" editable
  editor={({ row }) => (
    <div onKeyDown={event => this.handleKeyDown(event)}>
      <TextBox value={row.name}></TextBox>
    </div>
  )}
/>

[kifni41]

Thanks, your sample code works