Edit Page fetches the Data from the REST API, but doesn't populate the form fields.
Hi, I'm trying to create a Edit form for my card. I'm using
useForm . But it isn't populating the Form. I can confirm the Fetch was successful and the Data is there. But it isn't populating itself. I've attached the Screenshots. Afaik, it should populate the fields by itself after fetching the data right? any reason why it isn't? Thanks!
6 Replies
Hey @thalfpant! I'm the kapa.ai support bot. I've searched through the docs to try to answer your question. :wave:
----------------------
Hmm, I don't know enough to give you a confident answer yet. However, I can provide you with some guidance based on the information extracts.
When using
useForm with action: "edit", it fetches the record data according to the id with useOne (https://refine.dev/docs/api-reference/core/hooks/data/useOne/) and returns the queryResult for you to fill the form. After the form is submitted, it updates the record with useUpdate (https://refine.dev/docs/api-reference/core/hooks/data/useUpdate/). You can find an example of using useForm with action: "edit" in the documentation (https://refine.dev/docs/api-reference/core/hooks/useForm).
Make sure you're using the correct properties and methods from useForm to populate your form fields. If you're still having issues, I recommend reviewing the refine documentation (https://refine.dev/docs) and blog (https://refine.dev/blog) for more information and examples.
----------------------useOne | refine
useOne is an extended version of TanStack Query's useQuery. It supports all the features of useQuery and adds some extra features.
Overview | refine
What is refine?
Blog | refine
A Docusaurus powered blog!
<@439051486597611531> kapa.ai is still learning and improving, please let us how it did by reacting below
frail-apricot•17mo ago
When you give register("<field name>") field name should be same as your data.
For example Can you try
register("user.name")
unwilling-turquoise•17mo ago
it is the same.
frail-apricot•17mo ago
can you try controller please ?
example:
https://github.com/refinedev/refine/blob/next/examples/form-mui-use-form/src/pages/posts/edit.tsx#L49
i didn't tested but probably register not work with MUI. I looked react hook form documentation and they suggest controller too. our examples uses controller too
https://react-hook-form.com/get-started/