Replies: 2 comments 1 reply
-
Are you using a framework like Remix or Next, or doing a front-end-only build? The "best" way to submit data usually depends on this question. |
Beta Was this translation helpful? Give feedback.
1 reply
-
I found that a less elegant solution is to add lastResult to useEffect's dependency. const [form, fields] = useForm({
// Sync the result of last submission
lastResult,
// Reuse the validation logic on the client
onValidate({ formData }) {
return parseWithZod(formData, { schema: newOrderSchema });
},
// Validate the form on blur event triggered
shouldValidate: 'onBlur',
});
useEffect(() => {
if (form.status === 'success') {
notifications.show({
title: 'Success',
message: 'Order has been created successfully!',
});
}
if (form.status === 'error' && form.errors) {
notifications.show({
title: 'Error',
message: form.errors[0],
color: 'red',
});
}
}, [lastResult]); |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
This is an example action:
I'm trying to do the following:
Then, I hope to pop up a notification on the frontend indicating whether the submission was successful or failed, based on the status of the form.
The issue here is: if the user's submission is consistently failing or succeeding, then the notification will only appear the first time.
I might have been spoiled by libraries like react-query, because they have callback functions like
onSuccess
andonError
to help me accomplish such tasks.Beside the point, is this the right way (although it works)?
Beta Was this translation helpful? Give feedback.
All reactions