magic-amber
magic-amber12mo ago

Select defaultValue does not work on create page

How do you set a defaultvalue for select component on create page?
4 Replies
kapa.ai
kapa.ai12mo ago
Hi @silentnyte. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In Refine, you can set a default value for a select component using the defaultValue property in the useSelect hook. Here is an example:
import { useSelect } from "@refinedev/antd";
import { Select } from "antd";

interface ICategory {
id: number;
title: string;
}

const PostCreate: React.FC = () => {
const { selectProps } = useSelect<ICategory>({
resource: "categories",
defaultValue: 11,
});

return (
<Select
placeholder="Select a category"
style={{ width: 300 }}
{...selectProps}
/>
);
};
import { useSelect } from "@refinedev/antd";
import { Select } from "antd";

interface ICategory {
id: number;
title: string;
}

const PostCreate: React.FC = () => {
const { selectProps } = useSelect<ICategory>({
resource: "categories",
defaultValue: 11,
});

return (
<Select
placeholder="Select a category"
style={{ width: 300 }}
{...selectProps}
/>
);
};
In this example, the defaultValue is set to 11. The useSelect hook sends a useMany query to the backend with the defaultValue and appends it to the options of the Select component, ensuring the default values exist in the current options array. For more information, refer to the useSelect documentation (https://refine.dev/docs/api-reference/antd/hooks/field/useSelect/) and useMany documentation (https://refine.dev/docs/api-reference/core/hooks/data/useMany/). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai12mo ago
<@395261846862561301> kapa.ai is still learning and improving, please let us know how it did by reacting below
extended-salmon
extended-salmon12mo ago
Hello @silentnyte was bot's answer sufficient for you?
magic-amber
magic-amber12mo ago
The above is not sufficient when using Chakra you also need to useEffect setValue.