7 things you didn't know about <input>

8ec1383b240b5ba15ffb9743fceb3c0e?s=47 Phil Nash
February 05, 2020

7 things you didn't know about <input>

The element is one of the most versatile, but it does so much you might not know some of the more esoteric attributes available to you. This talk shows off 7 attributes of the element and their uses that you might not have known about.

--
Links:

HTML attributes to improve your users' two factor authentication experience: https://twil.io/2fa-attrs

8ec1383b240b5ba15ffb9743fceb3c0e?s=128

Phil Nash

February 05, 2020
Tweet

Transcript

  1. 1.

    7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash
  2. 4.

    THE POWER OF AN THE POWER OF AN THE POWER

    OF AN ELEMENT ELEMENT ELEMENT @philnash
  3. 5.

    THE POWER OF AN THE POWER OF AN THE POWER

    OF AN ATTRIBUTE ATTRIBUTE ATTRIBUTE @philnash
  4. 6.

    THE MANY TYPES OF THE MANY TYPES OF THE MANY

    TYPES OF THE <INPUT> THE <INPUT> THE <INPUT> ELEMENT ELEMENT ELEMENT @philnash
  5. 8.

    7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash
  6. 14.

    IT'S ABOUT IT'S ABOUT IT'S ABOUT VALIDATION VALIDATION VALIDATION BUT

    ALSO BUT ALSO BUT ALSO KEYBOARDS KEYBOARDS KEYBOARDS @philnash
  7. 17.
  8. 27.

    IT'S ABOUT NOT IT'S ABOUT NOT IT'S ABOUT NOT PRESSING

    PRESSING PRESSING SHIFT SHIFT SHIFT @philnash
  9. 29.
  10. 32.

    autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  11. 33.

    autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  12. 35.

    autocomplete name, honorific-prefix, given-name, additional-name, family-name, honorific-suffix, nickname, email, username,

    new-password, current-password, one-time-code, organization-title, organization, street-address, address-line1, address-line2, address-line3, address-level4, address-level3, address-level2, address-level1, country, country-name, postal-code, cc-name, cc-given-name, cc- additional-name, cc-family-name, cc-number, cc-exp, cc-exp- month, cc-exp-year, cc-csc, cc-type, transaction-currency, transaction-amount, language, bday, bday-day, bday-month, bday- year, sex, tel, tel-country-code, tel-national, tel-area-code, tel-local, tel-extension, impp, url, photo @philnash
  13. 39.

    7 THINGS YOU 7 THINGS YOU 7 THINGS YOU DIDN'T

    KNOW DIDN'T KNOW DIDN'T KNOW ABOUT <INPUT> ABOUT <INPUT> ABOUT <INPUT> @philnash