Adres-autocomplete toevoegen aan een webformulier

Waarom het adres automatisch aanvullen

Een met de hand getypt adres is waar de meeste leveringsfouten beginnen: een vergeten bus, een straat op twee manieren geschreven, de postcode van de buurgemeente. Officiële adressen voorstellen tijdens het typen haalt de fout weg voor ze bewaard wordt.

Het formulier wordt ook korter: één veld in plaats van vijf, ingevuld in enkele toetsaanslagen.

Wanneer de zoekopdracht versturen

• Wacht op twee of drie tekens: kortere invoer levert te veel resultaten op om te helpen.
• Wacht ongeveer 200 milliseconden na de laatste toetsaanslag, zodat iemand die snel typt één zoekopdracht verstuurt en niet tien.
• Annuleer de vorige aanvraag wanneer een nieuwe vertrekt, zodat een oud antwoord nooit een recenter antwoord overschrijft.
• Toon hoogstens vijf tot acht suggesties.

Wat te doen met de gekozen suggestie

Vul de gestructureerde velden (straat, nummer, bus, postcode, woonplaats) in vanuit de suggestie, niet vanuit de getypte tekst, en houd ze bewerkbaar.

Bewaar de coördinaten en de officiële identificator bij het adres: zo kunt u later twee adressen vergelijken zonder schrijfwijzen te vergelijken.

Heeft het gebouw bussen en bevat de suggestie er geen, vraag de bus dan in een apart veld in plaats van hem achter de straat te laten typen.

Toetsenbord en schermlezers

• De pijltjestoetsen lopen door de suggesties, Enter kiest er een, Escape sluit de lijst.
• Volg het ARIA-combobox-patroon: het veld heeft de rol combobox, de lijst de rol listbox, en aria-activedescendant volgt de gemarkeerde suggestie.
• Kondig het aantal suggesties aan in een live region.
• Blokkeer nooit vrije invoer: een gloednieuw gebouw staat misschien nog niet in de referentie.

Houd de API-sleutel op uw server

De sleutel die de API authenticeert, mag nooit in de browser terechtkomen, waar iedereen hem kan lezen. Stuur de zoekopdracht naar uw eigen backend, die de sleutel toevoegt en de oproep doorstuurt.

Diezelfde backend kan de meest getypte korte zoekopdrachten cachen en uw eigen limieten per bezoeker toepassen.

Facturatie die het typen volgt

Veel adresdiensten factureren elke oproep of elk gekozen adres. Addrly factureert zijn autocomplete per typesessie: de toetsaanslagen van één opzoeking tellen als één aanvraag, dus het wachten hierboven bespaart latentie, geen geld.

Veelgestelde vragen