Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

AutocompleteInput createLabel prop does not work. #9616

Closed
davidhenley opened this issue Jan 26, 2024 · 2 comments · Fixed by #9712
Closed

AutocompleteInput createLabel prop does not work. #9616

davidhenley opened this issue Jan 26, 2024 · 2 comments · Fixed by #9712
Assignees
Labels

Comments

@davidhenley
Copy link
Contributor

davidhenley commented Jan 26, 2024

Either the docs need to be updated or the functionality needs to be added.

We still REALLY need this functionality for our office applications as it is not apparent that you can start typing to create a new item. 🤞

#7822

https://marmelab.com/react-admin/AutocompleteInput.html#create

CleanShot 2024-01-25 at 21 20 31@2x

@slax57 slax57 added the bug label Jan 26, 2024
@slax57
Copy link
Contributor

slax57 commented Jan 26, 2024

I agree with you, this prop does not work as described so we should fix either the docs or the code.

In the meantime, maybe this can help? (from the section at the very bottom of the AutocompleteInput docs)

The Create %{item} option will only be displayed once the user has already set a filter (by typing in some input). If you expect your users to create new items often, you can make this more user-friendly by adding a placeholder text like this:

const PostCreate = () => {
    const categories = [
        { name: 'Tech', id: 'tech' },
        { name: 'Lifestyle', id: 'lifestyle' },
    ];
    return (
        <Create>
            <SimpleForm>
                <TextInput source="title" />
                <AutocompleteInput
                    onCreate={(filter) => {
                        const newCategoryName = window.prompt('Enter a new category', filter);
                        const newCategory = { id: categories.length + 1, name: newCategoryName };
                        categories.push(newCategory);
                        return newCategory;
                    }}
                    source="category"
                    choices={categories}
+                   TextFieldProps={{
+                       placeholder: 'Start typing to create a new item',
+                   }}
                />
            </SimpleForm>
        </Create>
    );
}

@davidhenley
Copy link
Contributor Author

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants