HTML Forms Lesson Overview

How to make forms:

  • The purpose of a <form> is to allow users to input information and send it.
  • The <form>‘s action attribute determines where the form’s information goes.
  • The <form>‘s method attribute determines how the information is sent and processed.
  • To add fields for users to input information we use the <input> element and set the type attribute to a field of our choosing:
    • Setting type to "text" creates a single row field for text input.
    • Setting type to "password" creates a single row field that censors text input.
    • Setting type to "number" creates a single row field for number input.
    • Setting type to "range" creates a slider to select from a range of numbers.
    • Setting type to "checkbox" creates a single checkbox which can be paired with other checkboxes.
    • Setting type to "radio" creates a radio button that can be paired with other radio buttons.
    • Setting type to "list" will pair the <input> with a <datalist> element if the id of both are the same.
    • Setting type to "submit" creates a submit button.
  • <select> element is populated with <option> elements and renders a dropdown list selection.
  • <datalist> element is populated with <option> elements and works with an <input> to search through choices.
  • <textarea> element is a text input field that has a customizable area.
  • When a <form> is submitted, the name of the fields that accept input and the value of those fields are sent as name=value pairs.


Leave a Reply

Your email address will not be published. Required fields are marked *