1

I have SPFX component with React library. The Dropdown menu is working fine with mouse onclick events. however, on pressing enter or space is not working. I am thinking of using eventhandlers such as "onkeyup" or "onkeypress", but I need help on how to render the dropdown on keyboard press.

My React component

@observer 
export default class DropdownReact extends React.Component<...>

...
//render method
  public render(): React.ReactElement<> {
    return (
       <Dropdown             
           label="Dropdown"
            defaultSelectedKey=
            onRenderTitle=
            onRenderItem= {this.CheckBoxRender.bind(this)}
             calloutProps=
             className=
             options=
             onKeyUp = ????
        />
   );
...

  }
//checkbox rendering method
private CheckBoxRender() {
  return (
    <div>
        <Checkbox 
           label=
            checked=
            onChange= />
     </div>
  );
}
  • What do you want to achieve exactly on onKeyUp? Render CheckBoxRender or call any other function? – Ganesh Sanap Jul 19 at 9:19
  • Thank you Ganesh for replying. Yes, I want to call CheckRender onkeyup . I tried it but it did not work. I don't know what I am missing. For onclick it seems it is working by default (it is not explicitly defined). I would expect for keyboard interactions to work by default as well – LapelCard Jul 21 at 23:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.