Selected value is lost in Mantine Select if a search is done after selecting a value
When using the selectProps from the useSelect hook, and creating a Mantine Select component with those props, if a value is selected from the list of options but the user does a search after, the original value already selected is lost from the input and the list of options, is there a way to always have the selected value available?
5 Replies
Hi @rafaelsorto. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Yes, you can ensure that the selected value is always available in the options by using the
defaultValue
property of the useSelect
hook. When you provide a defaultValue
, a separate useMany
query is sent to the backend with the defaultValue
, and the result is appended to the options of the <Select>
component. This ensures that the default values exist in the current options array.
Here's an example of how to use the defaultValue
property:
Refer to the useMany
documentation for detailed usage. → (https://refine.dev/docs/api-reference/core/hooks/data/useMany/)
In your case, you can set the defaultValue
to the selected value to ensure it's always included in the options.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------useMany | refine
useMany is an extended version of TanStack Query's useQuery. It supports all the features of useQuery and adds some extra features.
<@675886119006634036> kapa.ai is still learning and improving, please let us how it did by reacting below
unwilling-turquoise•16mo ago
Hello @rafaelsorto could you provide us a reproducible example of the issue? It’s hard to tell from the message.
cloudy-cyan•15mo ago
hey @batuhanw thanks for the reploy, I actually solved this by using the defaultValue prop and I am updating that parameter via a local state that detects the currenctly selected value so its always used as a "default value" and it solves the issue of a missing item in the select input