The Web Developer Bootcamp 2024
Colt Steele
HTML Forms
Sample form with basic HTML validation
Some Basic Input Types
HTML Form Validation
HTML itself has limited form validation. Most proper form validation is done with JavaScript.
But with
HTML,
you can specify elements as required inputs by adding the term required to the form
input statement.
eg. < input type="text" id="username" name="user" required>
So by simply adding required, HTML will do basic validation and ensure the form is not submitted
with
required fields.
You can also use this with elements using min, max, minlength, and maxlength
arguments, such as a password
field (for example), lets say, min length of 5, and max length of 10
If the length is too short, you'll get a message, and it will not let you add any more characters after
max
is reached.
< input type="password" id="pswd" name="pswd" minlength="5" maxlength="10" required>
You can also do some basic pattern matching on elements such as email and url's. More info can be found HERE.
Functioning Search Forms
Because every company has different formats for a search, do a search on their search page and from the results in the address bar, and pick out the address and "name" for the search query.
ex. for reddit,
form action = "https://www.reddit.com/search"
input name = "q"
*also, you can omit the "Submit" button and it will submit automatically when the user enters the search term and presses Enter, as in the Google example below.