7 Forms Flashcards
Get input from the user (html side)
<form>
</form>
Every form requires an action
t or f
t
Specify specific file name to output form information to
action=”filename and location”
Add the values from the form to the end of the URL
Used to request data from a specified resource.
method=”get”
Send the values to HTTP headers
Used to send data to a server to create/update a resource.
method=”post”
When do you use
method=”get” (2 situations)
short forms (such as search boxes)
when you are just retrieving data from the web server (not sending information that should be added to or deleted from a database)
When do you use
method=”post” (4 situations)
If your form:
allows users to upload a file
is very long
contains sensitive data
(e.g. passwords)
adds information to, or deletes information from, a
database
Control size of form
size attribute
but just use CSS now
What are the kinds of inputs?
(18 kinds)
Which of them do not follow the input type=”” format? (2) And what goes in the middle for them?
<input type=”text” />
<input type=”search”/>
<input type=”password”/>
<input type=”email”/>
<input type=”url”/>
<textarea> default text </textarea>
<input type=”radio”/>
(name=”” to define a group)
(checked=”checked” to set which one starts checked)
<input type=”checkbox”/>
(name=”” to define a group)
(checked=”checked” to set which one starts checked)
<input type=”range”/>
<select>
<option> option text </option>
<option> option text </option>
</select>
(selected=”selected” to set which one starts selected)
(multiple=”multiple” in the select tag to define that multiple options can be selected)
<input type=”file”/>
<input type=”submit” name=”SUBMIT”/>
(value attribute to define what text is on the tag
<input type=”image”/>
(same as submit)
<input type=”hidden”>
<input type=”date”/>
<input type=”email”/>
<input type=”number”/>
<input type=”tel”/>
<input type=”color”/>
textarea and select do not use the input type=”” format
When the form is inputted, ensure each input type is recognizable in the backend?
name=”name”
For those input types that do not have text or files as inputs, set the input value
value=”value”
use an image for a button
<button> <img src etc> Add
</button>
Make sure screen readers know what inputs are which
And expand clickable area to the text of the radio buttons for instance
< label> < input type=”blah”/> </label>
or
<input id=”female” type=”radio” name=”gender”
value=”f”>
<label for=”female”>Female</label>
Group form items into a box
Label the box
(good for checkboxes and radios)
(good for screenreaders to be able to separate related form options)
< fieldset>
< legend> Text </legend>
</ fieldset>
Require a form entry to be filled in before submission (in html)
required=”required”
or just
required
Have placeholder text in certain text input elements
Have text already in the field
<input type=”text” id=”first_name” placeholder=”greyed out text”>
<input type=”text” id=”first_name” value=”prefilled text”>
