CS 328 - Week 4 Lecture 2 - 2016-02-10
A Selection of HTML form elements and form controls, continued
* submit button ONLY submits info from form
controls IN the form containing that submit
button!!!
* textfields:
input elements with type="text"
* use for single-line, free-form
* SHOULD have a name attribute!
...and when its form is submitted,
you'll get
name=<whatever's typed in textfield then>
* initially blank UNLESS you include
an attribute value whose value is
the desired initial text
value="Type name here"
* numerous additional optional attributes...
such as size (how wide to DISPLAY textfield,
in "approx" characters)
and maxlength - max characters CAN
in
* aside: label element lets you logically
associate text with a form control
* IMPORTANT for accessibility
* CONVENIENT for better-usability
* two syntaxes for the label element:
<label> desired-label-text-and
desired-control-in-either-order </label>
<label class="blah" for="desiredElement">
LabelText:</label>
...
<input type="text" name="oof" id="desiredElement" />
* input elements CAN have a required="required"
attribute
(for strict HTML5, all attributes must have
values...)
* radio buttons!
* good for making EXACTLY ONE of a relatively
small number of exact choices
* input elements whose type="radio"
* to get them logically grouped,
give them the same name attribute value
* indicate that radio buttons desired
value with its value attribute
* to indicate WHICH should be initially
selected, use (strict-style) checked="checked"
* checkboxes!
* good for making ZERO OR MORE of a relatively
small number of exact choices
* input element whose type="checkbox"
* each checkbox SHOULD have a unique name
* use checked="checked" for each checkbox
you'd like to appear as initially checked --
use this for GOOD and NOT EVIL!!!
* note this ONLY sends a name=value pair
for a checkbox checked at the time
of submission
* drop-down box - select element
* by default, it is select-exactly-one of
potentially-many options
* (can have multiple="multiple" to allow user
to select multiple values at a time
<select name="desired_value">
<option value="whatever"> text that shows </option>
<option value="whatever"
selected="selected" > text that initially
shows </option>
<option value="whatever"> text that shows </option>
...
</select>