Na co je atribut autocomplete a jaké parametry…

A atribut autocomplete umožňuje prohlížeči poskytovat automatické doplňování polí formuláře. Zvyšuje uživatelský komfort tím, že nabízí dříve uložená data.

Parametry atributu autocomplete se dělí na dva typy: obecné a podle typu dat.

Obecné parametry:

off: Zakazuje automatické doplňování tohoto pole.
on: Povolení automatického doplňování tohoto pole.

Parametry podle typu dat (nejčastěji používané):

name: Celé jméno uživatele.
honorific-prefix: Titul před jménem (např. "Mr.", "Ms.").
given-name: Křestní jméno.
additional-name: Další jména (prostřední jméno).
family-name: Příjmení.
honorific-suffix: Titul za jménem (např. "Jr.", "Sr.").
nickname: Přezdívka.
email: E-mailová adresa.
username: Uživatelské jméno.
new-password: Nové heslo (pro pole vytváření hesla).
current-password: Aktuální heslo.
one-time-code: Jednorázový kód (např. pro dvoufaktorové ověření).
organization-title: Funkce.
organization: Název organizace.
street-address: Ulice a číslo domu.
address-line1: První řádek adresy.
address-line2: Druhý řádek adresy.
address-line3: Třetí řádek adresy.
address-level4: Nejmenší administrativní jednotka (např. vesnice).
address-level3: Třetí největší administrativní jednotka (např. okres).
address-level2: Druhá největší administrativní jednotka (např. město).
address-level1: Největší administrativní jednotka (např. kraj, stát).
country: Země.
country-name: Název země.
postal-code: PSČ.
cc-name: Jméno na kreditní kartě.
cc-given-name: Křestní jméno na kreditní kartě.
cc-additional-name: Další jména na kreditní kartě.
cc-family-name: Příjmení na kreditní kartě.
cc-number: Číslo kreditní karty.
cc-exp: Datum expirace kreditní karty (celé).
cc-exp-month: Měsíc expirace kreditní karty.
cc-exp-year: Rok expirace kreditní karty.
cc-csc: Bezpečnostní kód kreditní karty.
cc-type: Typ kreditní karty.
transaction-currency: Měna transakce.
transaction-amount: Částka transakce.
language: Preferovaný jazyk.

Parametry mohou také obsahovat prefixy, například shipping nebo billing, což označuje, že se jedná o údaje pro doručení nebo platbu.

Příklad použití:

<form>
  <label for="name">Jméno:</label>
  <input type="text" id="name" name="name" autocomplete="given-name">

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" autocomplete="email">

  <label for="street">Ulice:</label>
  <input type="text" id="street" name="street" autocomplete="shipping street-address">
</form>

Na co je atribut autocomplete a jaké parametry přijímá?