Forms

Forms are intrinsic to user interaction. Beyond basic hyperlinks, forms make things happen.

There is a lot to forms. The syntax itself is not particularly onerous, but the processing of the form requires some type of scripting, either client-side (using JavaScript), which happens on the client machine, or backend using any number of methods, which involves exchanging data with the server. Then there’s validation, or making sure you are getting the kind of data you are looking for.

Along with all of this, the design of forms is of particular interest. How a form is put together, and what it looks like, can either help or hinder the user’s ability to actually use the form. There are several enhancements that can be scripted to make forms more responsive as well as easier to use.

You may have more than one form on a page, and it can contain one or many different types of input, which may be interspersed with regular HTML. The forms can be interacted with client-side before actually being processed server-side. There may even be hidden values passed by the form. (These are not hidden in source code, they just don’t show up in the browser window.

This section…

…will look at all of these things: syntax, structure, design, processing and enhancement.

  1. The Form Tag

    Setting up a form; the form tag and its attributes.

  2. Structural

    Optional but recommended elements that give forms more structure (semantically as well as. umm, structurally), and increase accessibility.

  3. Input

    The basic methods of inputting data into forms.

  4. select and option

    Form menus.

  5. Textarea

    Inputting multiline text.

  6. Form Results

    Getting the results or values of a form.