0

I would like to prevent my submit button from refreshing my page when I click submit.

This is what I have tried

const formSubmit = e => {
    e.preventDefault();
    const newSubmission = {
      x: horizontal,
      y: vertical,
      steps: count,
      email: email.trim(),
    }
    // console.log(newSubmission)
    postNewSubmission(newSubmission);
  }

and my input:

    <input id="submit" onSubmit={formSubmit} type="submit"></input>

For added context, clicking on submit should send some data to an API and receive some response hence why I am calling postNewSubmission.

To reiterate, the issue is that everytime I click submit it refreshes my page - which is not I what I want - I would like to prevent this default behavior

Emm
  • 2,367
  • 3
  • 24
  • 50

2 Answers2

1

Wrap your input in form and put onSubmit on the form

<form onSubmit={formSubmit}>
   <input id="submit" type="submit" value="submit"></input>
</form>
Mubashir Waheed
  • 61
  • 1
  • 9
1

Just put the code below and you are good to go

<script>
if ( window.history.replaceState ) {
  window.history.replaceState( null, null, window.location.href );
}
</script>
Saurabh
  • 9
  • 4