React-admin: Autocomplete results in auto-selection

[anuragagarwal561994]

Please do not submit support requests or "How to" questions here. For that, go to StackOverflow.

What you were expecting:
Autocomplete is auto selecting the first record it thinks is a match.

What happened instead:
When I am trying to use autocomplete I do not expect it to auto-select something for me. For example if I have to search for K14923 and I have records K14 and K149 then when I will type K14 automatically the list will update to show me all K14 records. After then typing K149 will show me K149 records and so on. This results in multiple api calls to the list fetching, in addition to it if I have my onChange event within the autocomplete field it is being fired unnecessarily. The expectation would be to let user select the item from the autocomplete and only then it should result in filtering or wherever it is being used.

Also suppose my record is now K149, if I press backspace, then the list won't even fetch records for K14. If I have already K14 then K149 will not be selected so I am assuming the way the list is being displayed kind of broken here, because it is not giving a consistent functionality.

Related code:
https://github.com/marmelab/react-admin/blob/a1b27c4c21d70e94954441b26ceeaf9e848034c6/packages/ra-ui-materialui/src/input/AutocompleteInput.js#L212

Environment

• React-admin version: 2.1
• Last version that did not exhibit the issue (if applicable): false
• React version: 16.3
• Browser: Chrome
• Stack trace (in case of a JS error):

[fzaninotto]

This results in multiple api calls to the list fetching

It's a feature!

In fact, I don't understand your problem. Could you rephrase what you are trying to do and what you want instead, possibly adding screenshots?

[anuragagarwal561994]

In simple language, suppose I have in choices for autocomplete as K149 and K14, when I type K14, the value will be selected, my list is going to get filtered and I won't get a chance to choose K149.

[lihop]

Code:

    <AutocompleteInput source="issue-1993" choices={[
      {id: 1, name: "K14"},
      {id: 2, name: "K149"},
      {id: 3, name: "other"},
    ]} />

The first time there is a match between searchText and one of the suggestions it shows all suggestions.

The second time we have a match (after deleting and re entering the last character) the suggestion list is filtered so only the exact match is shown.

Expected behaviour
Whenever the input is active it should always show both partial and exact matches.

[djhi]

You can override the inputValueMatcher prop of the AutocompleteInput.

This is the default one: https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/input/AutocompleteInput.js#L496

[lihop]

Thanks. When I set inputValueMatcher={() => null} the input works as expected. However, it is still affected by #2121 so I have but more info there.