score:4
Accepted answer
you can pass the input
inside the select
the autofocus
prop and this will apply to the select
.
<select
native
value={value}
input={<input id="integer" autofocus={true} />}
>
{possibleoptions.map((item, key) => {
return (<option value={item} key={key}>{item}</option>)
})}
</select>
edit
when i posted the answer i have missed the part that you don't need the autofocus
.
if you are using an input inside your select
then you can use the inputref
prop and this will focus the underline input "attached" to the select.
code example and docs.
score:2
<select
ref="selectref"
native
value={value}
input={<input id="integer" />}
>
{possibleoptions.map((item, key) => {
return (<option value={item} key={key}>{item}</option>)
})}
</select>
to access, use
this.refs.selectref.focus()
here's a reference github link
Source: stackoverflow.com
Related Query
- how to set default value in select using react js
- React semantic UI: How to set focus for input field of dropdown element
- How to set Select component in Material-UI to loose its focus state after selecting one of its item
- How do I set a default value for a select menu in my React form component?
- How to set focus on FormControl - Select? (react)
- how to set focus to next input on enter key press in react js with refs
- In material-ui using react select how to move focus to next control by pressing tab only once?
- How can I set focus on a dynamically added field with React
- React > How to set focus on the input field after adding a new row by using react-table
- How to set focus on a button when react component renders?
- How to set focus on custom input in ReactJS using useRef and react hooks?
- how to open a textfield and set its value on select some value in dropdown in react
- How to set defaultValue after some delay on react select with react hook form
- How to set focus on child component's input on a button click in the parent in React Hooks
- how to set focus on input inside loop of react js
- How to set default value in material-UI select box in react (after API call)?
- How to focus and select a checkbox using React ref?
- How do I set focus on one Input instead of all in a React component?
- How to set focus after React state update/render
- How to set initial value in Select tag in React
- React how to focus div when contentEditable is set to true?
- How to set the first value in a select dropdown to as a default react
- How to set different values for different material select using states in functional component of react
- React hooks how to set focus on InputGroup from a child Form.Control
- How to set focus across an hierarchy in React
- How to set a select value when the page loads in react
- How can I make React select component auto matically set to accomodate label width?
- How to set previous State as default values in react material-ui select
- How can i set only value on react select
- How to set default value for select field in React js
More Query from same tag
- All web API calls return http 200 but with an undefined result object in a react application
- Show transition with css in React
- reactJs import ckeditor config correctly - CORS
- Catch all types of an interrface keys
- How to connect react-hook-form, react-select, and yup in typescript?
- Problems related to a resizable component
- The unsubscribe () in Rxjs method does not work on React js
- Spring Boot - React Failed to authorize filter invocation
- Whats the difference between Array.fill and a for loop to create Array
- 404 error when trying to list envelopes in react sample app
- React Dynamically download Components and get data from all child components
- Destructuring components in codepen
- React/Redux not updating the state
- React modules couldn't be hot updated
- React: CSS is not getting applied under the backtick
- Getting 'numPlay is not defined' error in React for button click method
- Bootstrap tooltip is not working with react.js
- trouble using set state correctly to update an event in react Big Calender
- How to destrucure data that changes with axios request in react
- Conditionally rendering a react component
- Merge created PDF with existing local PDF in ReactJS
- Using multiple react metis menu, allowing only one active item
- Delay in keyboard dismiss react-native
- How do you dynamically set a recipient in a mailto link?
- onMouseEnter active on all mapped elements
- Implementing this in Reactjs
- React.js Game of Life: Why doesn't the glider behave as expected?
- Typescript React alias HOC (to use <Component.alias />) typing issues
- How to make default checked for radio buttons in react?
- Spread operator with React useState // Populating state from Firebase