Day 8: HTML Forms
HTML forms are a fundamental component of web development. Forms are a structured area on a webpage where users can input data that is sent to a server for processing. They are typically used for several purposes, including:
- Submitting feedback.
- Registering for an account.
- Logging in to a system.
- Searching for information.
Here is a simple example, from mdn web docs:
Enter your name:
Enter your email:
Here, I will outline the key attributes necessary for understanding forms:
1. action
The URL that processes the form submission.
2. method
The HTTP method to submit the form with. The only allowed methods/values are:
• post: The POST method; form data sent as the request body.
• get (default): The GET; form data appended to the action URL with a ? separator. Use this method when the form has no side effects.
• dialog: When the form is inside a <dialog>, closes the dialog and causes a submit event to be fired on submission, without submitting data or clearing the form.
3. target
Indicates where to display the response after submitting the form.
• _self (default): Load into the same browsing context as the current one.
• _blank: Load into a new unnamed browsing context. This provides the same behavior as setting rel="noopener" which does not set window.opener.
• _parent: Loads the content into the parent browsing context of the current one. If no parent context exists, it functions the same as _self.
• _top: Load into the top-level browsing context (i.e., the browsing context that is an ancestor of the current one and has no parent). If no parent, behaves the same as _self.
• _unfencedTop: Load the response from a form inside an embedded fenced frame into the top-level frame (i.e., traversing beyond the root of the fenced frame, unlike other reserved destinations). Only available inside fenced frames.