How to customize useSelect hooks optionLabel with multiple value?
I have implemented useSelect hook on create form and which is working fine. But now there is an requirement to show the label with combining multiple field.
For eg:
I have a data as
Now I want my
optionLabel
to be the combination of title
and code
as E-business (3234)
, Virtual Invoice Avon (4232)
, and Unbranded (4232)
. Is there a way to achieve this?8 Replies
robust-apricot•2y ago
And also maybe if there is a possibility to pass a react node with custom design layout then that would be amazing 😍
Hey @dipbazz 👋 ,
I hope you are very well. Can you check this thread?
https://discord.com/channels/837692625737613362/940873134020640788/940877337237528608
robust-apricot•2y ago
Thank you @Omer. It worked as I expected.
probable-pink•14mo ago
@Omer do you remember the actual thread you posted here? It's no longer visible and I have the exact same requirement 😅
Hey @bastianwegge 👋 ,
We're happy to see you!
Unfortunately there isn't a very cool way but I created a CodeSandbox for you.
https://codesandbox.io/s/refine-use-select-example-forked-s55ne?file=/src/pages/posts/create.tsx
probable-pink•14mo ago
@Omer thanks for the sollution! It's much nicer than what I have right now!
I don't know if I should open a new thread for this but: Since you posted a way to display the ID of an entity. Is it possible to search by the title OR the id via filters?
Ah I got it:
it's basically working like this! 🎉
You can use the
defaultValue
property
https://refine.dev/docs/api-reference/core/hooks/useSelect/#defaultvalueuseSelect | refine
useSelect hook allows you to manage any select (like a Html `` tag, React Select, etc...) component. Since it is designed as headless, It expects you to handle the UI.
probable-pink•14mo ago
What's your comment referring to?