how to make POST api request by click on Save Button

I have to call this POST api "users/edit/:id" with refine inferencer above API config contain dynamic id in param and other data in body
No description
kapa.ai
kapa.ai374d ago
Hi @kyvoxdev. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
kapa.ai
kapa.ai374d ago
---------------------- To make a POST request with a dynamic ID in the URL and other data in the body, you can use the useCustom data hook provided by Refine. Here's an example of how to use it: 1. First, add a custom method to your data provider to handle custom requests. You can find an example in the Refine documentation (https://refine.dev/docs/api-reference/core/providers/data-provider#custom). 2. Next, use the useCustom data hook in your component to make the POST request with the dynamic ID and other data in the body. Replace :id with the actual ID value you want to use.
import { useCustom } from "@refinedev/core";

const { mutate: editUser } = useCustom({
resource: "users",
method: "post",
});

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
payload: userData,
});
};
import { useCustom } from "@refinedev/core";

const { mutate: editUser } = useCustom({
resource: "users",
method: "post",
});

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
payload: userData,
});
};
In this example, handleSubmit is a function that takes an id and userData as arguments. When called, it sends a POST request to the /users/edit/:id endpoint with the dynamic ID and the provided userData in the request body. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Data Provider | refine
Data provider acts as a data layer for your app, making HTTP requests and encapsulating how the data is retrieved. The methods of these requests are then consumed by refine via data hooks.
kapa.ai
kapa.ai374d ago
<@1106450860571111444> kapa.ai is still learning and improving, please let us how it did by reacting below
deep-jade
deep-jade374d ago
@kapa.ai I have to call this POST api "users/edit/:id" with refine inferencer above API config contain dynamic id in param and other data in body
kapa.ai
kapa.ai374d ago
Let me check the knowledge base for you. One moment! :books:
kapa.ai
kapa.ai374d ago
---------------------- Refine doesn't have a built-in "inferencer" feature. However, you can use the useCustom data hook provided by Refine to make a POST request with a dynamic ID in the URL and other data in the body. Here's an example of how to use it: 1. First, add a custom method to your data provider to handle custom requests. You can find an example in the Refine documentation (https://refine.dev/docs/api-reference/core/providers/data-provider#custom). 2. Next, use the useCustom data hook in your component to make the POST request with the dynamic ID and other data in the body. Replace :id with the actual ID value you want to use.
import { useCustom } from "@refinedev/core";

const { mutate: editUser } = useCustom({
resource: "users",
method: "post",
});

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
payload: userData,
});
};
import { useCustom } from "@refinedev/core";

const { mutate: editUser } = useCustom({
resource: "users",
method: "post",
});

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
payload: userData,
});
};
In this example, handleSubmit is a function that takes an id and userData as arguments. When called, it sends a POST request to the /users/edit/:id endpoint with the dynamic ID and the provided userData in the request body. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Data Provider | refine
Data provider acts as a data layer for your app, making HTTP requests and encapsulating how the data is retrieved. The methods of these requests are then consumed by refine via data hooks.
kapa.ai
kapa.ai374d ago
<@1106450860571111444> kapa.ai is still learning and improving, please let us how it did by reacting below
deep-jade
deep-jade374d ago
@kapa.ai I am getting ERROR Property 'mutate' does not exist on type 'QueryObserverResult<CustomResponse<BaseRecord>, HttpError>'.
kapa.ai
kapa.ai374d ago
Let me check the knowledge base for you. One moment! :books: ---------------------- Apologies for the confusion earlier. To make a POST request with a dynamic ID in the URL and other data in the body, you should use the useCustomMutation hook instead of useCustom. Here's an example of how to use it:
import { useCustomMutation } from "@refinedev/core";

const { mutate: editUser } = useCustomMutation();

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
method: "post",
values: userData,
});
};
import { useCustomMutation } from "@refinedev/core";

const { mutate: editUser } = useCustomMutation();

const handleSubmit = async (id, userData) => {
await editUser({
url: `/users/edit/${id}`,
method: "post",
values: userData,
});
};
In this example, handleSubmit is a function that takes an id and userData as arguments. When called, it sends a POST request to the /users/edit/:id endpoint with the dynamic ID and the provided userData in the request body. You can find more information about the useCustomMutation hook in the Refine documentation (https://refine.dev/docs/api-reference/core/hooks/data/useCustomMutation). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai374d ago
<@1106450860571111444> kapa.ai is still learning and improving, please let us how it did by reacting below
wise-white
wise-white374d ago
Hey @kyvoxdev, You can use meta to send custom variables to your data provider. You can check this to learn how to do: https://refine.dev/docs/tutorial/understanding-dataprovider/create-dataprovider/#meta-usage Btw, the inferencer has developed for development environment. So, you can't do this on Inferencer. However, you can copy the generated code and you can customize it.
deep-jade
deep-jade371d ago
Thanks @salihozdemir 👍
More Posts
do i need to create another project for the front end of my project?I created a project, Nextjs, MaterialUI and Supabase… When i go to localhiost 3000, it just gives mefetch datai want to fetch a specific resource . I used useMany but it is required to add ids and I do not wantHow do I create a fronted It’s justHow do I create a fronted??? It’s just giving me the client side and no real FrontEnd paceReferring component’s local state inside MUI’s DataGridSo I’m noticing that the renderCell function of a column cannot refer the updated value of the curreSave modifications to a relationshipIn my edit page for posts, I pull in the authors information. I want to save any changes to the authCustom data-provider for same resource and "useTable" for different http requestsI need to build a custom data provider for fetching data from my API. My use case requires me to shoHow to re-run useDataGrid?Hi, I have a use case wherein I want to re-fetch the rows of my table on a button click (after updatHow can i get the action in a component that receives useModalForm props?I have a component that shows as a drawer an receives useModalFrom props. how can i know the action?multiple menu entries pointing to the same resourceIs possible to have in the sidebar multiple items pointing to the same resource but changing the queuseUpdateMany to update different ids with different data for each iduseUpdateMany({resource:'', ids:IdArray, values: what to give here ?}) id1 has different value than hi am using refine firebase as the datahi, am using refine-firebase as the data provider but meta populate is not workingHow can I split on more lines the sidebar item text?I want to split the label: 'Gestione Terreno' on two lines so that it will be fully visible on the swhat's the best way to check status/debug live provider updates? (MUI/Supabase)I am using the builtin live provider and having very intermittent success with live events showing uHello I m studying if Refine is a goodHello, I'm studying if Refine is a good option for an internal admin panel I'm creating. This applicHow to set the pagination for server side paginationI have set my backend to accommodate _start and _end query for the select method, but from the datagfirestore listenerHow do I setup firestore listener for document snapshots retrieved from firestore in my data provideMUIhow can I import MuiThemeProvider in refine , where I tried to import it but it is not working !Referencing theme algorithm in other filesI'm trying to change the color of my logo depending on the selected theme algorithm. I want to checkcan't modify the title in sidebar muiin version 4 i can't change the title i already did the customization in title component it generatdatagridhow to make the last column pinned to right