useful-bronze
useful-bronze3y ago

Refine doesn't display the green message of successfully submitted

I successfully uploaded a Form in the database, but It doesn't show up the successfully submitted green message on top of page and it doesn't empty the text fields in the Form page.
9 Replies
kapa.ai
kapa.ai3y ago
Hi @ging_freecs. 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.ai3y ago
---------------------- To show a success notification after the form is submitted successfully, you can use the successNotification prop in the useForm hook. Make sure you have the NotificationProvider (https://refine.dev/docs/api-reference/core/providers/notification-provider/) in your project for this prop to work. Here's an example of how to use the successNotification prop:
useForm({
successNotification: (data, values, resource) => {
return {
message: `Post Successfully created with ${data.title}`,
description: "Success with no errors",
type: "success",
};
},
});
useForm({
successNotification: (data, values, resource) => {
return {
message: `Post Successfully created with ${data.title}`,
description: "Success with no errors",
type: "success",
};
},
});
Regarding clearing the form fields after submission, you can use the reset function provided by the useForm hook. Call the reset function after the form is submitted successfully. Unfortunately, I don't have enough information from the provided extracts to give you a specific code example for resetting the form fields. However, you can refer to the useForm documentation for more information on how to use the reset function: - Refine useForm documentation (https://refine.dev/docs/api-reference/core/hooks/useForm) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Notification Provider | refine
refine let's you set a notification API by providing the notificationProvider property to the `` component.
useForm | refine
useForm is a hook that allows to manage forms. It has some action methods that create, edit and clone the form. The hook return value comes to according to the called action and it can run different logic depending on the action.
kapa.ai
kapa.ai3y ago
<@296624290843983873> kapa.ai is still learning and improving, please let us how it did by reacting below
foreign-sapphire
foreign-sapphire3y ago
hi, do you have notification provider ? and which ui library are u using ?
useful-bronze
useful-bronzeOP3y ago
material ui. About the notification provider i think i am using the default one, cause I am watching the Javamastery youtube video
foreign-sapphire
foreign-sapphire3y ago
but it shows notification in tutorial video, isn't it ?
useful-bronze
useful-bronzeOP3y ago
exactly, just i am making my customizations. I think in the tutorial the message that appears on top of page is in the server side, with res.status(200).json({ message: "Property created succesfully!" }); in the network message i can see it by inspecting the page
foreign-sapphire
foreign-sapphire3y ago
i suggest you to double check your implementation because our examples works as normal. https://codesandbox.io/s/github/refinedev/refine/tree/next/examples/form-material-ui-use-form?from-embed=&file=/src/pages/posts/create.tsx and bot it's right, if you can customize like that
useForm({
refineCoreProps: {
successNotification: (data, values, resource) => {
return {
message: `Post Successfully created with ${data.title}`,
description: "Success with no errors",
type: "success"
};
}
}
});
useForm({
refineCoreProps: {
successNotification: (data, values, resource) => {
return {
message: `Post Successfully created with ${data.title}`,
description: "Success with no errors",
type: "success"
};
}
}
});
useful-bronze
useful-bronzeOP3y ago
Thank you very much

Did you find this page helpful?