How Do I Submit A Form's Data To Another Function Without Refreshing The Page?

I'm working on a collection of web apps using REACT JS. For part of the current app I'm working on, I have a modal that renders on a state change and has a form to receive a name

Solution 1:

It feels like you could use more React to make your life easier here.

You don't have to use the form's onSubmit event. You could just add an onClick handler to the button. In that function, you could do all the comparing you want and, whrn you're ready, it can do the submitting logic too.

If you wanted to compare the form's values, you might want to keep those values in state. To do so though, you would need onChange functions on each of the form elements to update the state as the user provides input.

As I didn't see much React code in your example, I took the liberty of writing some out. Hopefully it will help you:

https://codesandbox.io/s/elastic-shape-yrv0b