R
Refine

ask-any-question

save

Ooptimistic-gold1/22/2024
when create a new item or product and clicking a save i want to pass props that are outside of form
Kkapa.ai1/22/2024
Hi @Alex YT. 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 pass additional properties to the save button using the saveButtonProps property. This property is available in both the <Create> and <Edit> components. Here's an example of how you can use saveButtonProps in the <Create> component:
import { Create } from "@refinedev/antd";

const PostCreate: React.FC = () => {
return (
<Create saveButtonProps={{ size: "small" }}>
<p>Rest of your page here</p>
</Create>
);
};
import { Create } from "@refinedev/antd";

const PostCreate: React.FC = () => {
return (
<Create saveButtonProps={{ size: "small" }}>
<p>Rest of your page here</p>
</Create>
);
};
In this example, the size property is passed to the save button, making it small. You can replace size: "small" with any other properties you want to pass to the save button. For more information, you can refer to the refine documentation (https://refine.dev/docs/ui-integrations/ant-design/components/basic-views/create#savebuttonprops). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai1/22/2024
<@398749213795680259> kapa.ai is still learning and improving, please let us know how it did by reacting below
Ooptimistic-gold1/22/2024
@kapa.ai while saving i want to pass data outside the form how to do oit?
Kkapa.ai1/22/2024
Let me check the knowledge base for you. One moment! :books: ---------------------- In refine, you can modify the data before submitting it to the API by overriding the submit function in the useForm or useStepsForm hooks. This allows you to include additional data outside of the form. Here's an example of how you can do this:
import { useStepsForm } from "@refinedev/antd";

const { current, gotoStep, stepsProps, formProps, saveButtonProps, onFinish } = useStepsForm({
submit: (values) => {
const data = {
fullName: `${values.name} ${values.surname}`,
age: values.age,
city: values.city,
// Add additional data here
};
onFinish(data as any);
},
});
import { useStepsForm } from "@refinedev/antd";

const { current, gotoStep, stepsProps, formProps, saveButtonProps, onFinish } = useStepsForm({
submit: (values) => {
const data = {
fullName: `${values.name} ${values.surname}`,
age: values.age,
city: values.city,
// Add additional data here
};
onFinish(data as any);
},
});
In this example, the submit function is overridden to combine the name and surname fields into a fullName field. You can add additional data to the data object before calling onFinish. For more information, you can refer to the refine documentation (https://refine.dev/docs/ui-integrations/ant-design/hooks/use-steps-form#how-can-i-change-the-form-data-before-submitting-it-to-the-api). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai1/22/2024
<@398749213795680259> kapa.ai is still learning and improving, please let us know how it did by reacting below
Ooptimistic-gold1/22/2024
@kapa.ai how to pass default values on useModal form
Kkapa.ai1/22/2024
Let me check the knowledge base for you. One moment! :books: ---------------------- In refine, you can pass default values to the useModalForm hook using the defaultValues or defaultFormValues property. This property is used to pre-populate the form with data that needs to be displayed and is only available for the "create" action. Here's an example of how you can do this:
const modalForm = useModalForm({
defaultValues: {
title: "Hello World",
},
});
const modalForm = useModalForm({
defaultValues: {
title: "Hello World",
},
});
or
const modalForm = useModalForm({
defaultFormValues: {
title: "Hello World",
},
});
const modalForm = useModalForm({
defaultFormValues: {
title: "Hello World",
},
});
In these examples, the form is pre-populated with a title of "Hello World". You can replace this with any other data you want to pre-populate the form with. For more information, you can refer to the refine documentation (https://refine.dev/docs/packages/react-hook-form/use-modal-form#properties) or refine documentation (https://refine.dev/docs/ui-integrations/ant-design/hooks/use-modal-form#properties). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai1/22/2024
<@398749213795680259> kapa.ai is still learning and improving, please let us know how it did by reacting below

Looking for more? Join the community!

R
Refine

ask-any-question

Join Server
Recommended Posts
How to disable the submit button after clicking it, and restore it when submits fails?Hi, I'm using Ant Design to build a very complicated form. However when I click the submit button (bHow to return a specific error message from the backend server for the resource update / create?Hi, I'm using `@nestjsx/crud` adapter with Refine. What I want to do is that I want to rewrite some How to hide resource from sidebarHow can I hide a menu item from sidebar resource? I want to hide some particular menu links from myAdd a a POST api call on an a page when editThanks for an awsome framework. I have a page where i do some edits on some fields. Now I also need Crud api headerHow can i add a auth token to the header that i call if i use infencerSupabase and RBACHow to implement supabase and RBAC in refine?Group Nav buttons in a bulk buttonHi in the CRUD App is there a way to Group Nav buttons in a bulk button that hide and reveal subbuttSupabase- Ability for admin user to add usersHi everyone, I have a client who's plan for a crud app is to disable user signup as it'll be an inteHow to load a component both in Authenticated and Unauthenticated state?How can I arrange my routes to load a component page both in authenticated and unathenticated state?crud operator for text[]Hi guys, I can't filter my field I have a field name superfood which is a text array in supabase db Nextjs app routerHow setup refine using the latest nextjs app router and shadcn uiWhen sidebar is collapsed, changing page on paginated list open sidebar menu itemWhen changing the page, the page and offset query parameter of path is modified and is detected as aUseMany missing in some generated pages by the MUIinferencerWhats the reason why some List pages are generated by the MUIinferencer with the UseMany methods andgraphql mutationi am using graphql for and i want to pass different meta fields for getOne and update using useForm Filter a table field with outside component and stateHi guys, I'm using useTable to get data from database, here is my useTable code ```const filter = sugraphql mutationI am trying to use useForm from ``` import { useForm } from "@refinedev/react-hook-form"; ``` i waUpdate specific field by using mutate useUpdateHi guys, I'm using mutate of useUpdate() to update a record on my db How can I just update a specifiedit modalI am trying to create a edit modal inside the card. my card contains only name which can be edited oHiding a button in the Navbar based on User Role (MUI)Hi, How can i hide a button in the Nav bar based on the role of the user connected? (MUI)Filtering with useList and state operationHi guys, I currently have a List with useList to get data from a table with supabase Now I have a bu