More HTML5 form controls...

*   radio buttons
    *   SHOULD be used in a select-exactly-one-of
        these kinds of situation;
    *   (probably best when there aren't TOO many
        options...)

    *   input element
        type attribute whose value is "radio"

    *   how do you logically group them?
        ...you give all the grouped radio buttons
	the SAME value for the name attribute

        (browser is expected to only allow you
	select ONE of a set of radio buttons
	with the same name attribute value...)

	and the selected button's value will be
	sent as the value for that name when
	the form is submitted;

    *   (yes, the grouped radio buttons SHOULD
        have different value attributes...!)

    *   it is good STYLE to initially have
        one radio button in a logical group
	selected --

	the PREFERRED way is to give that
	button an attribute checked with value
	"checked" -- checked="checked"

    *   example: radio1.html

*   you can make the text associated with a radio
    button (or checkbox) "hot"/selectable,
    as well as making it logically associated
    with the control (good for accessibility!)

    by using a label element --
    one of 2 ways mentioned in the text
    is to PUT the radio button or checkbox
    WITHIN a label element;

    *   example: radio2.html

*   checkboxes!
    *   input element, type="checkbox"
    *   these SHOULD have different name attribute
        values!
        ...if checked when its form is submitted,
	that name is sent with a value of on
	to the application tier
    *   want it to initially be checked?
        checked="checked", as for radio buttons

    *   we'll use label elements to associate
        their text with them, too

    *   checkbox1.html

*   drop-down menu/select element
    *   has its own element! select

    *   contains option elements for the
        options to choose from

    *   if you'd like to indicate which
        option "shows" initially,
	give that option a selected="selected"
	attribute and value

    *  select1.html

    *  would you like more than 1 option to show
       at a time? use size attribute in the select's
       start tag

    *  would you like more than 1 option to be selectable
       at a time?
       *   in select start tag: multiple="multiple"
       *   it is considered good style to give a size
           attribute whose value is other than 1
       *   it is considered good style to end the 
           name attribute value for such a select
	   with []

       *   user CAN select non-consecutive options
           with control-click (Windows) or command-click (Mac)

       *   select2.html

*   text notes -- a GENERAL rule-of-thumb -- 
    when MANY options or screen space is tight,
    probably drop-down is better than radio button/checkbox;

    (of course, if only ONE is to be chosen,
    use radio buttons or a select with not multiple!)

    (and if 0-many, use checkboxes or a select WITH multiple)

*   textarea - appropriate when the user is
    to enter multiple lines of text

    its own element -- texarea

    *   name attribute should be included
    *   rows attribute - give it desired height in rows
    *   cols attribute - give it a desired width in "columns"/chars

    *   content between the textarea start and closing tags
        IS the initial content of the textarea --
	if indent the closing tag, you DO get extra whitespace!

    *   textarea1.html

*   password field
 
    *   an input element with a type attribute whose
        value is password

    *   won't display what's being typed into that
        field -- a LITTLE more secure

    *   (this does NOT make it TRANSFER securely --
        just makes it harder to read over someone's
	shoulder!)

    *   password1.html

*   reset button -
    *   NOT as popular as used to be...
    *   an input element whose type attribute has the value
        "reset"
    *   when clicker, restores the form's controls to
        their initial values

    *   reset1.html