Create Page - Autoselect Autocomplete based on id on parameter
Hi, i want to make my create page automatically selects the value on the dropdown autocomplete based on given id from the parameter
For example, i want to automatically select the user from this dropdown based on the params given on the url
![No description](https://cdn.answeroverflow.com/1093555293679534130/image.png)
4 Replies
Hi @regnregn. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
To automatically select a value in the dropdown based on a given ID from the URL parameter, you can use the
defaultValue
property in the useAutocomplete
or useSelect
hooks, depending on the UI library you're using.
Here's an example for each UI library:
For Material-UI:
Source (https://refine.dev/docs/api-reference/mui/hooks/useAutocomplete)
For Ant Design:
Source (https://refine.dev/docs/api-reference/antd/hooks/field/useSelect)
For Mantine:useAutocomplete | refine
useAutocomplete hook allows you to manage Material UI `` component when records in a resource needs to be used as select options.
useSelect | refine
useSelect hook allows you to manage Ant Design `` component when records in a resource needs to be used as select options.
Source (https://refine.dev/docs/api-reference/mantine/hooks/useSelect)
Replace
11
with the ID from the URL parameter in the defaultValue
property. You can use the useParsed
(https://refine.dev/docs/api-reference/core/hooks/navigation/useParsed) hook to get the id
from the URL parameter.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------useSelect | refine
useSelect hook allows you to manage Mantine `` component when records in a resource needs to be used as select options.
useParsed | refine
useParsed is a hook that leverages the parse method of the routerProvider to access the URL and query parameters along with the inferred resource, action and id from the URL.
<@336843331416096768> kapa.ai is still learning and improving, please let us how it did by reacting below