gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

cleanup html input docs (#20241)

Browse Source 
cleanup html input docs

- General cleanup and editing
- Add types section
- Remove old YouTube link
This commit is contained in:
Andrew Anguiano
2018-10-29 02:42:26 -04:00
committed by Huyen Nguyen
parent 0f95416c24
commit 4daa530eda
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
guide/english/html/attributes/input/index.md
View File

@ -1,11 +1,11 @@
--- ---
title: Input title: Input
--- ---
## Input
The HTML `<input>` tag is used within a form to declare an input element.
It allows the user to enter data.
## Example ## Input
The HTML `<input>` tag is used to create an element which allows a user to input data. Typically this would be within a `<form>` element, although it's not required.
### Example
```html ```html
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
@ -15,28 +15,28 @@ It allows the user to enter data.
</head> </head>
<body> <body>
<form action = "/cgi-bin/hello_get.cgi" method = "get"> <form action="/my-form-action" method="get">
First name: <label for="first_name">First Name:</label>
<input type = "text" name = "first_name" value = "" maxlength = "100" /> <input type="text" name="first_name" value="" maxlength="100" />
<br /> <br />
Last name: <label for="last_name">Last Name:</label>
<input type = "text" name = "last_name" value = "" maxlength = "100" /> <input type="text" name="last_name" value="" maxlength="100" />
<input type = "submit" value = "Submit" />
<input type="submit" value="Submit" />
</form> </form>
</body> </body>
</html> </html>
``` ```
In the above example, there are two input fields which ask the user to enter their first and last names according to the labels specified. The submit `<button type="submit">` is another type of input which is used to take the data entered by the user into the form and send it to some other location specified in the code. In the above example, there is a form with two text fields which ask the user to enter their first and last names according to the labels specified. `<input type="submit">` is another type of input which is used to submit the form's data to the URL defined in the form's `action` attribute.
#### More Information: ### Types
<a href="https://www.youtube.com/watch?v=qJ9ZkxmVf5s">Youtube</a> There are many types of `<input>` tags which can be specified with the input's `type` attribute. A few common types are:
- **Text** - Creates a simple text box
- **Password** - Creates a text field but masks the characters typed into the input
## Input - **Checkbox** - Creates a checkbox field that allows the user to select multiple options
The HTML `<input>` tag is of many types to enter data. Some of them are: - **Radio** - Creates a field that allows a user to select only one option
Type:Text(This is the most common type which is used to create general textboxes) - **Submit** - Displays a button that submits the form when clicked
Type:Password(This type is used for creation of password feilds) - **Hidden** - This is a special type that doesn't render on the page. It's typically used to pass additional data along with a form.
Type:Hidden(This is a special type of Input that is not shown to the user but it is used for passing information from one page to another while using <a href> tag)