Kam skirtas autocomplete atributas ir kokius…

autocomplete atributas leidžia naršyklei teikti automatinio užpildymo galimybę formos laukams. Tai pagerina naudotojo patogumą, siūlydama anksčiau išsaugotus duomenis.

autocomplete atributo parametrai skirstomi į dvi rūšis: bendrieji ir pagal duomenų tipą.

Bendrieji parametrai:

off: Draudžia automatinį užpildymą šiam laukui.
on: Leidžia automatinį užpildymą šiam laukui.

Pagal duomenų tipą parametrai (dažniausiai naudojami):

name: Vartotojo pilnas vardas.
honorific-prefix: Titulas prieš vardą (pvz., "Mr.", "Ms.").
given-name: Vardas.
additional-name: Papildomi vardai (tarpinis vardas).
family-name: Pavardė.
honorific-suffix: Titulas po vardu (pvz., "Jr.", "Sr.").
nickname: Pravardė.
email: Elektroninio pašto adresas.
username: Vartotojo vardas.
new-password: Naujas slaptažodis (slaptažodžio kūrimo laukas).
current-password: Dabartinis slaptažodis.
one-time-code: Vienkartinis kodas (pvz., dviejų veiksnių autentifikacijai).
organization-title: Pareigos.
organization: Organizacijos pavadinimas.
street-address: Gatvė ir namo numeris.
address-line1: Pirmas adreso eilutė.
address-line2: Antras adreso eilutė.
address-line3: Trečias adreso eilutė.
address-level4: Mažiausia administracinė vienetas (pvz., kaimas).
address-level3: Trečia pagal dydį administracinė vienetas (pvz., rajonas).
address-level2: Antra pagal dydį administracinė vienetas (pvz., miestas).
address-level1: Didžiausia administracinė vienetas (pvz., regionas, valstija).
country: Šalis.
country-name: Šalies pavadinimas.
postal-code: Pašto kodas.
cc-name: Vardas kreditinėje kortelėje.
cc-given-name: Vardas kreditinėje kortelėje.
cc-additional-name: Papildomi vardai kreditinėje kortelėje.
cc-family-name: Pavardė kreditinėje kortelėje.
cc-number: Kreditinės kortelės numeris.
cc-exp: Kreditinės kortelės galiojimo pabaigos data (visa data).
cc-exp-month: Galiojimo pabaigos mėnuo.
cc-exp-year: Galiojimo pabaigos metai.
cc-csc: Kreditinės kortelės saugumo kodas.
cc-type: Kreditinės kortelės tipas.
transaction-currency: Transakcijos valiuta.
transaction-amount: Transakcijos suma.
language: Pageidaujama kalba.

Parametrai taip pat gali turėti prefiksus, pvz., shipping arba billing, nurodant, kad tai yra pristatymo arba apmokėjimo duomenys.

Pavyzdys naudojimo:

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

  <label for="email">El. paštas:</label>
  <input type="email" id="email" name="email" autocomplete="email">

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

Kam skirtas autocomplete atributas ir kokius parametrus jis priima?