Edit page select dropdown show current value

How can you get the edit page select dropdown show current value instead of select?
2 Replies
kapa.ai
kapa.ai9mo 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: ---------------------- To display the current value in the select dropdown on the edit page, you can use the useSelect hook from Refine. This hook fetches the data and sets the default value to the current value. Here's an example of how to use it:
import { useSelect } from "@refinedev/antd";
import { Select } from "antd";

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

const ProductCreate: 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 ProductCreate: 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, you can refer to the Refine useSelect documentation (https://refine.dev/docs/api-reference/antd/hooks/field/useSelect/). Please note that you need to replace "categories" with your resource name and 11 with the id of the current value you want to display in the select dropdown. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@395261846862561301> kapa.ai is still learning and improving, please let us know how it did by reacting below