question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[useAutocomplete] Add option to disable selecting text on first focus

See original GitHub issue
  • I have searched the issues of this repository and believe that this is not a duplicate.

Summary 💡

The text of the input is selected on first focus of input. Add a new prop to useAutocomplete to opt out of this behavior

Examples 🌈

add selectTextOnFirstFocus prop that defaults to true

const handleClick = () => {
    if (
      firstFocus.current &&
      inputRef.current.selectionEnd - inputRef.current.selectionStart === 0
    ) {
      inputRef.current.focus();
      selectTextOnFirstFocus && inputRef.current.select();
    }

    firstFocus.current = false;
  };

Motivation 🔦

To make useAutocomplete more flexible.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:8 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
Bebersohlcommented, Jan 11, 2020

Sure

0reactions
ManavJethanicommented, Sep 11, 2022

Hi, @oliviertassinari @Bebersohl , I am facing an issue with MUI autocomplete, whenever i assign aria attributes to autocomplete it breaks my css. Also when i focus on the input, i get an error Uncaught TypeError: inputRef.current is null handleClick useAutocomplete.js:900, please let me know how i will resolve this. I am assigning the aria attribute on input field <TextField {...params} label="please select" variant="outlined" inputProps={{ "aria-describedby":'some label' }} /> Screenshot 2022-09-11 at 1 46 40 PM

Read more comments on GitHub >

github_iconTop Results From Across the Web

[useAutocomplete] Add option to disable selecting text on first ...
So that you can use useAutoComplete without the input text being selected in the initial focus. Here is a work around for anyone...
Read more >
Don't allow to focus out an autocomplete select - Stack Overflow
I need to force users to select an option from a list of items, created by jquery-ui autocomplete. I would like to disable...
Read more >
React Autocomplete component - Material UI - MUI
The autocomplete is a normal text input enhanced by a panel of suggested options. The widget is useful for setting the value of...
Read more >
jQuery UI Autocomplete
Before focus is moved to an item (not selecting), ui.item refers to the focused item. The default action of focus is to replace...
Read more >
Autocomplete | Angular Material
Set each option's value property to whatever you'd like the value of the text input to be when that option is selected. content_copy....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found