How do HTML Forms Work? | HTML Interview Questions

What You'll Learn

How forms collect and submit data
GET vs POST methods
Form controls and elements

Understanding HTML Forms

HTML forms collect user input and send it to a server for processing. The <form> element wraps input fields and defines where and how data is sent.

Key Attributes

action - URL where data is sent
method - HTTP method (GET or POST)

GET vs POST

Method	Data Location	Use Case
GET	Visible in URL	Search, filters
POST	Hidden in body	Login, signup

Form Controls

index.htmlHTML

<form action="/submit" method="POST">
  <!-- Text inputs -->
  <label for="name">Name:</label>
  <input type="text" id="name" name="name" required>

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required>

  <!-- Textarea -->
  <label for="message">Message:</label>
  <textarea id="message" name="message" rows="4"></textarea>

  <!-- Select dropdown -->
  <label for="country">Country:</label>
  <select id="country" name="country">
    <option value="us">United States</option>
    <option value="uk">United Kingdom</option>
  </select>

  <!-- Checkbox and Radio -->
  <input type="checkbox" id="subscribe" name="subscribe">
  <label for="subscribe">Subscribe</label>

  <button type="submit">Submit</button>
</form>

Important

The name attribute is crucial - it becomes the key in submitted data.