简体   繁体   中英

React Bootstrap component (Form.Control) OnChange event listener doesn't fire when select all text and delete

I am using Form.Control in form, and when changing the input, I use onChange event listener, to handle the change as in this snapshot:

<Form.Control
      className="form-control"
      type="text"
      id={props.id}
      defaultValue={props.placeholder}
      onChange={(e) => {
        updateInput(e);
      }}
></Form.Control>

all changes work fine, adding chars, deleting,,etc,
But when => Select ALL text and hit backspace, onChange event Listener, isn't fired !
ps: selecting part of the text and deleting it, fires the onChange.

Ok, I solved this issue by, adding onSelect event listener, and called same function triggered from onChange, as in this snapshot:

<Form.Control
          className="form-control"
          type="text"
          id={props.id}
          defaultValue={props.placeholder}
          onChange={(e) => {
            updateInput(e);
          }}
          onSelect={(e) => {
            updateInput(e);
          }}
></Form.Control> 

however, I believe something is wrong with onChange event listener and this is just a workaround.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM