# Adresse-autocomplete i DanDomain Webshop

> Indsæt ét script-tag i dit DanDomain-design, så adressefelterne får autocomplete med postnr. og by, og peg det på felterne, hvis dit design kalder dem noget andet.
>
> https://danadresse.dk/guides/dandomain · verified 2026-11-02
DanDomain Webshop lader dig lægge egen JavaScript i designet, så adressefelterne kan få autocomplete uden et modul. Vores script `danadresse-auto` med ét tag finder selv adressefelterne. Samme trin virker for de webshops, DanDomain driver under andre navne: SmartWeb, Wannafind, Scannet og Curanet.

## 1. Opret en browsernøgle

Opret en *live*-nøgle under [Nøgler](/dashboard/keys), og tilføj butikkens domæner under **Tilladte domæner**. Åbn checkout-siden, og kig i adresselinjen: kører checkout'en på et andet domæne end resten af butikken, skal det domæne også på listen. Se [Browsernøgler og tilladte domæner](/guides/browser-noegler-domaener).

## 2. Indsæt script-tagget

I DanDomain Webshop går du til **Webshop → Design → Ret design** på det aktive design, vælger **Indsæt Javascript**, indsætter tagget under **Sidens indhold (bunden)** og klikker **Gem**. I DanDomain Webshop Classic indsætter du det i bunden af designskabelonen, før `</body>`.

```html id=auto-tag run=no
<script src="https://api.danadresse.dk/js/danadresse-auto.min.js"
        data-key="DIN_BROWSER_NØGLE" defer></script>
```

Scriptet genkender platformens egne feltnavne (`m-usercreate-address`, `-zipcode`, `-city` og `address`, `zipcode`, `city`) og i Classic de almindelige navne `Address`, `ZipCode`, `City` og `DeliveryAddress`, `DeliveryZipCode`, `DeliveryCity`. Det matcher også danske labels som "Adresse", "Postnr." og "By". Når kunden vælger et forslag, udfyldes vej og husnr. (med etage og dør), postnr. og by, og en leveringsadresse holdes adskilt fra fakturaadressen.

Vi har tjekket opbygningen af DanDomain Webshops kontoformular på en live side. Checkout-navnene følger samme mønster, men er ikke tjekket i en live butik, og vi har ikke set en live Classic-butik. Test din egen checkout, før du stoler på den.

## 3. Test

Test i et privat vindue med en skæv indtastning som "rodovre parkvej 150". Forslaget skal være Rødovre Parkvej med det rigtige postnummer, og postnr. og by skal blive udfyldt. Åbn browserens konsol, hvis intet sker:

- `API refused the request (403): … locked to …` betyder, at domænet mangler under nøglens **Tilladte domæner**.
- Findes intet felt, så tilføj `data-debug` til tagget, genindlæs, og læs hvad konsollen viser.

## Hvis felterne ikke bliver fundet

Find feltets selektor: højreklik på adressefeltet, vælg **Inspicér**, og brug et `id`, der er det samme efter en genindlæsning (`id="address"` → `#address`), eller `name` (`name="address"` → `input[name="address"]`). Gør det samme for postnr. og by, og giv selektorerne til scriptet:

```html id=auto-fields run=no
<script src="https://api.danadresse.dk/js/danadresse-auto.min.js"
        data-key="DIN_BROWSER_NØGLE"
        data-fields='[{"street":"#dit-adressefelt","zip":"#dit-postnummerfelt","city":"#dit-byfelt"}]' defer></script>
```

Du kan mappe `street`, `house`, `floor`, `door`, `line2`, `zip`, `city` og `country`. Er husnummeret et separat felt i din checkout, så map det som `house`.

## Eller: din egen init-kode

Vil du have fuld kontrol over, hvad der udfyldes, så kobl adresse-widget'en på selv. Ret de tre selektorer i `FIELDS`, og indsæt din nøgle:

```js id=init-js run=syntax
const API_KEY = "DIN_BROWSER_NØGLE";

// Ret til dine felter (se trin 2)
const FIELDS = {
  adresse: "#dit-adressefelt",
  postnr: "#dit-postnrfelt",
  by: "#dit-byfelt",
};

function setField(el, value, events) {
  if (!el || value == null) return;
  const setter = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(el), "value").set;
  setter.call(el, value);
  for (const type of events || ["input", "change"]) {
    el.dispatchEvent(new Event(type, { bubbles: true }));
  }
}

function streetLine(a) {
  let line = a.vejnavn + " " + a.husnr;
  if (a.etage) line += ", " + a.etage + ".";
  if (a["dør"]) line += " " + a["dør"];
  return line;
}

function bindAll() {
  document.querySelectorAll(FIELDS.adresse).forEach((input) => {
    DanadresseAutocomplete.attach(input, {
      apiKey: API_KEY,
      onSelect(a) {
        setField(input, streetLine(a), ["change"]);
        setField(document.querySelector(FIELDS.postnr), a.postnr);
        setField(document.querySelector(FIELDS.by), a.postnrnavn);
      },
    });
  });
}

function start() {
  bindAll();
  new MutationObserver(bindAll).observe(document.body, { childList: true, subtree: true });
}

if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", start);
else start();
```

Indsæt den lige før `</body>` i den skabelon, checkout-siden bruger:

```html id=template-html run=no
<script src="https://danadresse.dk/static/js/danadresse-autocomplete-1.0.0.js"></script>
<script>
  /* indsæt init-koden ovenfor her */
</script>
```

Betalingsudbyderens betalingsvindue kan ikke få widget'en. Det behøver det heller ikke, for adressen er gemt inden da. Server-side validering kræver adgang til ordren, fx via en eksport eller integration. Se [Datavask i checkout](/guides/datavask-i-checkout).

## Næste skridt

- [DanDomain-siden](/integrationer/dandomain) under Integrationer
- [Browsernøgler og tilladte domæner](/guides/browser-noegler-domaener)
- [Shoporama](/guides/shoporama)