Forms Flashcards
“<form></form>” How would you describe what it does.
the form element is a container for a set of controls [usually “<input></input>” elements], that sends data to an address with the action=”” attribute.
How does a form element know where to submit the data?
The element knows to submit to the location specified in the action attribute.
What can you do with the method=”” attribute on a form?
method=”get” … [default] the form data is appended to the URL with a ? separator, use this if the form has no side effects.
method=”post” … the form data is sent as the request body.
method=”dialog” … when the form is within a “<dialog>" element, closes the dialog and throws a submit event on submission without submitting the data or clearing the form.</dialog>
What can the target=”” attribute do on a form?
The target attribute indicates where to display a response.
_self [default] loads reply into the same browsing context as the current one.
_blank loads into a new unnamed browsing context
_parent loads into the parent browsing context of the current, if there is no parent this will function the same as _self.
_top loads into the top level browsing content, [Oldest ancestor without a parent] if there is none, will behave as _self.
What element is used to specify what controls are associated with?
The “<label></label>” element, specified with the for=”” attribute.
How does the name=”” attribute impact forms?
The name attribute will create a key=value pair to submit into the form, each pair will be appended by a & separator.
Do “<button></button>” elements behave differently in a form?
Yes, their default behavior in a form will be to submit, need type=”button” to go back to original behavior.
input type=”button”
An input element that will display as a clickable button.
input type=”checkbox”
Creates a checkbox to select/deselect.
input type=”color”
Creates a color picker.
input type=”email”
Creates a text field for general validation parameters around email addresses.
input type=”file”
Creates a file selector input for the document.
input type=”hidden”
A control that is not displayed, but still has its value submitted to the server[form action address].
input type=”number”
A control that displays a spinner and lets the user input numbers, with numeric validation.
input type=”password”
Creates a text field that will have it’s value obscured. Will alert user if site is not secure.
