Wiki-Quellcode von Autofill
Zeige letzte Bearbeiter
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{figure image="designer-properies-autofill-de-1.png"}} | ||
| 2 | Für Eingabefelder können die Werte des autocomplete-Attributs konfiguriert werden, damit der Browser den Nutzer bei der Eingabe mit Autovervollständigung unterstützen kann. | ||
| 3 | {{/figure}} | ||
| 4 | |||
| 5 | Browser schlagen Nutzern bei Eingaben in Textfeldern Werte vor, eine sogenannte Autovervollständigung. Hierbei weiß der Browser aber nicht, welche Art von Inhalt in einem Textfeld erwartet wird. Mithilfe dieser Eigenschaften ist es möglich, festzulegen, welcher Inhalt erwartet wird. Etwa bei E-Mail-Feldern schlägt der Browser so nur E-Mail-Adressen vor. | ||
| 6 | |||
| 7 | Technisch wird dies mithilfe des HTML-Attributs //autocomplete// umgesetzt. Einige hilfreiche Links: | ||
| 8 | |||
| 9 | * [[Mögliche Werte für das autocomplete-Attribute bei MDN Web Docs>>url:https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete]] | ||
| 10 | * [[W3C-Spezifikation des autocomplete-Attributs>>url:https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofilling-form-controls:-the-autocomplete-attribute]] | ||
| 11 | * [[WCAG 2 Test Rules für das autocomplete-Attribute>>url:https://www.w3.org/WAI/standards-guidelines/act/rules/autocomplete-valid-value-73f2c2/]] | ||
| 12 | |||
| 13 | {{table dataTypeAlpha="0" colWidth="-500"}} | ||
| 14 | |=Name|=Beschreibung | ||
| 15 | |Wert|Erwarteter Inhalt des Eingabefelds. Wenn gesetzt, versuchen Browser, nur entsprechende Inhalte vorzuschlagen. | ||
| 16 | |Kategorie|Welche Optionen hier möglich sind, hängt von dem gewählten Wert ab. Mit der Kategorie kann der erwartete Inhalt weiter eingeschränkt werden. Beispielsweise können E-Mail-Adressen auf private oder geschäftliche Adressen eingeschränkt werden. | ||
| 17 | |Bereich|Optional. Wenn gesetzt, wird am Anfang des //autocomplete//-Attributs der Wert //section-*// vorangestellt. Dies ist nützlich, wenn ein Formular etwa mehrere verschiedene Adresseingaben enthält. Eine Adresse besteht aus mehreren Textfeldern wie Land, Postleitzahl, oder Straße. Werden alle Textfelder, die zur Adresse 1 gehören, der Sektion //one// zugeordnet und alle Textfelder, welche zur Adresse 2 der Sektion //two//, dann kann der Browser zwischen beiden Adressen unterscheiden und füllt nur die entsprechende Sektion aus, wenn der Nutzer eine Adresse auswählt. | ||
| 18 | {{/table}} |