Kevin Powell - CommunityKP-C
Kevin Powell - Community•9mo ago•
41 replies
Faker

What is the default behavior when we submit an HTML form?

Hello, consider the following code:

<form action="./submit_page" method="get">
  <h2>Subscribe to our newsletter</h2>
  <p>
    <label for="name">Name (required):</label>
    <input type="text" name="name" id="name" required />
  </p>
  <p>
    <label for="email">Email (required):</label>
    <input type="email" name="email" id="email" required />
  </p>
  <p>
    <button>Sign me up!</button>
  </p>
</form>


My question is, if we let the form as it is in its default behavior, what happens when we click on the submit button?

Say I have a server running on localhost. When I press the button, am I redirected to ./submit_page or the page refresh but the data is sent to the route ./submit_page and it's the job of my server to handle the incoming data?

If we want to prevent a page redirection or page refresh, is there a particular attribute we should add on the form element or we should prevent the form default behavior using javascript, then use fetch() to send the appropriate data?
Was this page helpful?