21:T426,const PostCreate: React.FC = () => { return ( ( <> { // Your custom logic here saveButtonProps.onClick(e); }} /> )} >

Rest of your page here

); }; ``` This approach is available for **Mantine** (), **Chakra UI** (), and other UI libraries supported by refine. Choose the method that best fits your UI library and use case. Remember to adjust the code according to your specific needs and the UI library you're using with refine. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------22:T4fd,---------------------- Thank you for clarifying that you're using Material-UI (MUI) with refine. For MUI, you can intercept the save button and add extra data before submission using a similar approach. Here's how you can do it: 1. Using `useForm` hook with MUI: ```tsx import { useForm } from "@refinedev/react-hook-form"; import { Create } from "@refinedev/mui"; const PostCreate: React.FC = () => { const { saveButtonProps, refineCore: { onFinish }, handleSubmit, } = useForm(); const onSubmit = (data) => { onFinish({ ...data, extraData: "Some extra data" }); }; return ( {/* Your form fields */} ); }; ``` This approach allows you to modify the form data before it's submitted to the API. The `onSubmit` function will be called with the form data, which you can then modify before passing it to `onFinish`. 2. Using `footerButtons` prop with MUI: Alternatively, you can use the `footerButtons` prop of the `` or `` components to customize the save button behavior: ```tsx import { Create, SaveButton } from "@refinedev/mui"; import { Button } from "@mui/material";23:T5ca,

intercept save button

Similar Threads

Similar Threads

Similar Threads