multiple resource
"use client";
import { Box, TextField } from "@mui/material";
import { Create } from "@refinedev/mui";
import { useForm } from "@refinedev/react-hook-form";
export default function TemplateCreate() {
const {
saveButtonProps,
refineCore: { formLoading },
register,
formState: { errors },
} = useForm({
refineCoreProps: {
resource: "categories",
},
});
return (
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
<Box
component="form"
sx={{ display: "flex", flexDirection: "column" }}
autoComplete="off"
>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
</Box>
</Create>
);
}
@kapa.ai Here i want to store "title" field one in resource "category" and "title" field two in resource "template"
5 Replies
Hi @Deepanshu Bajaj. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
To achieve storing the "title" field in two different resources ("category" and "template"), you will need to handle the form submission manually and make two separate API calls. Unfortunately, the provided knowledge sources do not include a direct example of handling multiple resources in a single form submission. However, I can guide you on how to approach this based on the general usage of
useForm
and Create
components in refine.
Here's a modified version of your code to handle the form submission manually:
In this example:
1. We use useCustom
to create custom mutations for the "categories" and "templates" resources.
2. We handle the form submission manually using handleSubmit
from useForm
.
3. On form submission, we make two separate API calls to store the titles in their respective resources.
This approach ensures that each title is stored in the correct resource. For more detailed information, you can refer to the refine documentation (https://refine.dev/docs/).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@661831547690680321> kapa.ai is still learning and improving, please let us know how it did by reacting below
correct-apricotOP•7mo ago
Property 'mutate' does not exist on type 'QueryObserverResult<CustomResponse<BaseRecord>, HttpError> & UseLoadingOvertimeReturnType'.ts(2339)
any @kapa.ai
Let me check the knowledge base for you. One moment! :books:
----------------------
The error message
Property 'mutate' does not exist on type 'QueryObserverResult<CustomResponse<BaseRecord>, HttpError> & UseLoadingOvertimeReturnType'.ts(2339)
indicates that you are trying to use the mutate
function on a type that does not support it. This typically happens when you are using a hook that is meant for querying data rather than mutating it.
In refine, hooks like useQuery
are used for fetching data, while hooks like useMutation
(e.g., useCreate
, useUpdate
, useDelete
) are used for mutating data.
To resolve this issue, ensure you are using the correct hook for the operation you intend to perform. For example, if you want to update data, you should use the useUpdate
hook.
Here is an example of how to use the useUpdate
hook correctly:
Make sure you include the values
property in the mutate
function call, as it is required for the useUpdate
hook to work correctly. The values
property contains the data that will be sent to the server.
For more details, you can refer to the useUpdate documentation (https://refine.dev/docs/data/hooks/use-update/#values-).
If you are trying to perform a GET request on a button click, you should use a different approach, such as using useCustom
or useQuery
with a manual trigger. However, the provided knowledge sources do not include a direct example of this. You can refer to the refine documentation for more information on custom requests.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@661831547690680321> kapa.ai is still learning and improving, please let us know how it did by reacting below