Backspaces and arrowKey are not working in spreadsheet header custom Input

Posted by: gautam.kumar on 6 April 2022, 5:39 am EST

  • Posted 6 April 2022, 5:39 am EST

    Hi,

    I am opening inputBase material-ui on doubleclicking the header , I am able to add alphanumeric values at that time onChange , onKeyDown and onKeyUp event is getting called/triggered but backspace and arrowkey is not calling event like onChange or okKeyDown, only onKeyUp is getting triggered.

    but after onMouseClick inside input text field the backspaces and arrowkey is also working able to call onChange or okKeyDown. Is this a bug in Spreadsheet? or is there any solution for this.

    Sample for inputbase :

    const ColumnBox = React.FC = (props) => {

    return (

    <ClickAwayListener onClickAway={() => props.clickAwayHandler()}>

    <InputBase

    id=“input_id”

    type=“text”

    value={props.value}

    onChange={(e) => {

    console.log(“onChange”,e);

    }}

    onKeyUp={(e) => {

    console.log(“onkeyUp”,e);

    }}

    onKeyDown={(e) => {

    console.log(“onkeyDown”,e);

    }}

    autoFocus

    onBlur = {() => props.clickAwayHandler()}

    />



    );

    };

    Thanks.

  • Posted 7 April 2022, 7:07 am EST

    Hi,

    SpreadJS does not handle backspaces and arrowkeys differently if focus is not on the sheet. Could you please update and share back the following sample to demonstrate your issue so that we could have a better understanding of your setup, investigate the root cause of the issue and assist you accordingly

    https://codesandbox.io/s/cool-river-owzigz?file=/src/index.js

    Regards

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels