ui
ui copied to clipboard
Conditionally select an item in Select component
When a value is selected and onValueChange
runs which causes the page to update the value selected is lost. But I can get that value from the url, but I can't conditionally select that value when Select re-renders. I tried using defaultChecked
but its not working. Any help is appreciated!
<Select onValueChange={(value) => {
const json = JSON.parse(value);
router.replace(`${json.name}?catId=${json.id}`);
}}>
<SelectTrigger className="text-[#828282] rounded-[8px] text-[12px]">
<SelectValue placeholder="Select Category" />
</SelectTrigger>
<SelectContent>
{category.data?.data.map((item) => {
return <SelectItem key={item.id}
defaultChecked={pageParams.category.toString().toLowerCase() === item.name.toLowerCase()}
value={JSON.stringify({ id: item.id.toString(), name: item.name.toLowerCase() })}
className="text-[12px]">
{item.name}
</SelectItem>
})}
</SelectContent>
</Select>
@ezechuka If it would be possible then can you assign me to this issue I want to resolve this
@pragyamishra56 I think only the project maintainers can assign someone to an issue
@pragyamishra56 do you have an idea on how to fix it?
@ezechuka Sir Could you assist me by providing a screenshot to help clarify where the problem is?
This is what I'm trying to achieve, I want to conditionally select an item in the Select component to reflect the current category which is in the url. So fashion should be checked or selected since that's what's in the url.
It seems like you want that when someone clicks on an element, the link to the website appears at the bottom corner of the screen
This is what I'm trying to achieve, I want to conditionally select an item in the Select component to reflect the current category which is in the url. So fashion should be checked or selected since that's what's in the url.
Use defaultValue inside of Select
Component
This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.
I too have this issue where I want to have an item in the select preselected that is fetched from db. I wanted to check if the value matches what is fetched and have it preselected and allow the user to change their selection. Any idea how or is it possible with chadcn select?