I have form in react.
And I need to detect if the form has successfully been submitted to make a next request in another form
const formRef = React.useRef<HTMLFormElement>(null);
useEffect(() => {
if (formRef && formRef.current) {
formRef.current.submit();
}
}, [formRef]);
<>
<form
id="tdsMethodAcs"
method="post"
target="methodAcsFrame"
action={three_ds_method_url}
style={{ display: "none" }}
ref={formRef}
>
<input
type="hidden"
name="methodAcsFrame"
value={method_data_packed}
/>
<input type="submit" />
</form>
<iframe name="tdsMethodAcsFrame" width="0" height="0"></iframe>
</>
Probably the shortest way is to create a variable in the state to which you change the value when the form is submitted. Somethink like this:
const [formSubmitted, setFormSubmitted];
const onSubmit = () =>{
//Do stuff
setFormSubmitted(true);
}
useEffect(()=>{
//Do another stuff
},[formSubmitted])