marmelab / marmelab/react-admin

<AutocompleteInput> freeSolo without clearOnBlur issue

Open
#7,583 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

needs more info
Dominant language
TypeScript
Stars
26.9k
Forks
5.5k
Avg merge
2d 3h
Merged PRs (30d)
19

Description

What you were expecting:

In https://mui.com/material-ui/react-autocomplete/ AutocompleteInput have both comboBox mode and freeSolo mode

For freeSolo mode user should be able to type in the input box without the need to click add ... from the suggestion list.
E.g. https://mui.com/material-ui/react-autocomplete/#search-input

What happened instead:

  1. The freeSolo mode prop seems is replaced by create or onCreate prop
  2. After disabling the clearOnBlur prop, the form save button cannot be clicked even the form's value have changed.

Steps to reproduce:

  1. Goto https://osy236.sse.codesandbox.io/#/comments/1
  2. In the last AutocompleteInput box type something other than "comment1" in suggestion list, e.g. "comment2"
  3. Click away from this input, so the inputbox should now have "comment2"
  4. The form's save button is not enabled.

Related code:

https://codesandbox.io/s/youthful-diffie-osy236?file=/src/comments/CommentEdit.tsx:4445-4481

Other information:

The suggested behavior would be if freeSolo is true and onCreate is undefined,
The user does not need to click the create button in the suggestion list in order to create.
They should be able to type something and leave it there.

Environment

  • React-admin version: 4.0.1
  • Last version that did not exhibit the issue (if applicable):
  • React version: 17.0.2
  • Browser: Firefox 99
  • Stack trace (in case of a JS error):

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the AutocompleteInput component and the CommentEdit.tsx example linked in the issue, then reproduce the freeSolo and clearOnBlur behavior with the provided steps. Done means users can leave typed values without clicking an add option, and the form save button becomes enabled when that value changes.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.