Forms Notes

HTML Interview Questions: Forms, Tables and Media

Thirty questions on the areas interviewers use to separate people who have built real things from people who have read about them.

HTML

Project: Registration, Login and Contact Forms

Three forms that cover almost every input type, validation pattern and accessibility requirement you will meet in real work.

HTML

Project: A Product Page

An image gallery, a specification list, a quantity form and structured data. The page where hidden fields, tables and forms all have to be right at on...

HTML

Forms and JavaScript

Read values, submit without a page reload, validate with the built in API, and handle errors accessibly. All of it built on a real form element.

HTML

GET or POST: What Happens When a Form Is Submitted

Two methods, two very different places for your data. Learn which to use, what is safe in a URL, and why neither is encrypted on its own.

HTML

Built In Form Validation

The browser can check most of a form before it is sent, with no JavaScript. Learn the attributes, the CSS hooks, and why none of it replaces server va...

HTML

Buttons: submit, reset and button

Three button types, one attribute, and a default that causes more accidental submissions than any other rule in HTML.

HTML

textarea, File Uploads and Hidden Fields

Three controls with their own rules: a textarea whose value is its content, a file input that needs the right enctype, and hidden fields that are not...

HTML

select, option, optgroup and datalist

Dropdowns done properly: grouping options, multiple selection, the placeholder option trick, and when a datalist beats a select.

HTML

Checkboxes, Radio Buttons and Grouping

Checkboxes for many answers, radios for one. The name attribute is what groups radios, and fieldset with legend is what makes either group make sense.

HTML

Labels: The Most Important Element in a Form

A label names a field for every reader and grows its click target. Two ways to bind one, and the reasons a form without labels is not usable.

HTML

Input Types: Text, Email, Number, Date and the Rest

One element, more than twenty types. Choosing the right one gives you the correct mobile keyboard, free validation and better autofill, at no cost.