Log ind

nShift Help Center

nShift Checkout widget brugerinteraktion

Avatar
Malene Tidemann
Opdateret

nshift-checkout-label.png

 

To forskellige typer ændringer kan påvirke widgetten: eksterne og interne. Begge skal håndteres forskelligt af websiden.

Lær om:

 

Vigtig note: nShift Checkout widget kan ikke bruges med Delivery Checkout (ældre version). Læs mere om den ældre widget her. 

 

Eksterne ændringer

En ekstern ændring sker, når parametre ændres, som kan påvirke, hvilke forsendelsesmuligheder der vises i widgetten. Almindelige parametre kunne være modtagerens postnummer eller den samlede pris for de varer, der købes. Det væsentlige ved disse parametre er, at de er eksterne for widgetten. Når nogen af dem ændres, skal nye data om forsendelsesmuligheder anmodes fra serveren. Når dataene er tilgængelige, skal widget-metoden updateOptions kaldes for at vise de nye forsendelsesmuligheder. For at anmode om data om forsendelsesmuligheder, brug koden fra afsnittet Fyld widgetten med forsendelsesmuligheder.

 

 

Interne ændringer

En intern ændring sker, når brugeren interagerer med widgetten. Dette inkluderer begivenheder som at vælge en forsendelsesmulighed eller skrive tekst i et inputfelt. Når en ændring sker, vil funktionen resultCallback fra widgetSettings blive kaldt med et resultatobjekt. Hvis egenskaben valid i resultatobjektet er true, kan informationen i resultatobjektet bruges til at oprette en forsendelse. Hvis valid er false, er informationen ufuldstændig, og der kræves mere brugerinteraktion. Informationerne i resultatobjektet kan stadig bruges til at opdatere websiden for at afspejle brugerens valg indtil videre. For eksempel for at opdatere den samlede pris baseret på det nuværende valg i widgetten.


Bemærk venligst, at interne ændringer ikke bør udløse en anmodning om nye forsendelsesmuligheder. Den information, som brugeren indtaster eller vælger i widgetten, vil ikke ændre, hvilke forsendelsesmuligheder der er tilgængelige.

 

Resultatobjektet

Dette er strukturen af resultatobjektet. Det er tilgængeligt enten som resultatargumentet i resultCallback eller fra result-egenskaben på widgetinstansen.

 

{
   "valid":true,
   "sessionId":"00000000-0000-0000-0000-000000000000",
   "checkoutId":"00000000-0000-0000-0000-000000000000",
   "checkoutVersion":1,
   "optionId":"00000000-0000-0000-0000-000000000000",
   "pickupPointId":"12345",
   "timeSlotId":"2345",
   "addons":[
      {
         "addonId":"NOTIFY",
         "price":1.0,
         "originalPrice":0.0,
         "fields":[
            {
               "fieldId":"EMAIL",
               "value":"info@example.com"
            }
         ],
         "additionalValues":{
            "key1":"value1"
         }
      }
   ],
   "fields":[
      {
         "fieldId":"PHONE",
         "value":"1234567890"
      }
   ],
   "totalPrice":1.0,
   "totalOriginalPrice":0.0,
   "taxRate":0.0,
   "additionalValues":{
      "key2":"value2"
   },
   "resultsVersion":"2",
   "widgetVersion":"2"
}

 

  • valid - Denne egenskab er sand, hvis resultatet er gyldigt og kan bruges til at oprette en forsendelse.

     
  • sessionId - Denne egenskab er UUID'en for den session, der blev brugt til at anmode om forsendelsesmulighederne. Den er nødvendig for at oprette en forsendelse.

     
  • checkoutId - Denne egenskab er UUID'en for checkout-konfigurationen, der blev brugt til at generere forsendelsesmulighederne.
  • checkoutVersion - Denne egenskab er versionsnummeret for checkout-konfigurationen, der blev brugt til at generere forsendelsesmulighederne. Dette vil være det faktiske versionsnummer for checkout-konfigurationen, selv når sessionen blev oprettet kun ved brug af den aktive checkout-konfigurations ID.

     
  • optionId - Denne egenskab er UUID'en for den forsendelsesmulighed, der er valgt i widgetten. Den er nødvendig for at oprette en forsendelse.

     
  • pickupPointId - Denne egenskab er den transportørspecifikke ID for det afhentningssted, der er valgt i widgetten. Den er kun nødvendig, hvis forsendelsesmuligheden bruger afhentningssteder. Bemærk, at formatet og længden af ID'en er transportørspecifik.

     
  • timeSlotId - Denne egenskab er den transportørspecifikke ID for det tidsrum, der er valgt i widgetten. Den er kun nødvendig, hvis forsendelsesmuligheden bruger tidsrum. Bemærk, at formatet og længden af ID'en er transportørspecifik.

     
  • addons - Denne egenskab er et array med tilvalg, der er valgt under den valgte forsendelsesmulighed. Hver post i arrayet er et objekt med disse egenskaber:
     
    • addonId - Denne egenskab er ID'et for tilvalget.
    • price - Denne egenskab er prisen, der er lagt til den samlede pris, fordi dette tilvalg er valgt.
    • originalPrice - Denne egenskab er den oprindelige pris, der er lagt til den samlede oprindelige pris, fordi dette tilvalg er valgt.
    • fields - Denne egenskab er et array af feltinput under det valgte tilvalg. Hver post i arrayet er et objekt med disse egenskaber:
      • fieldId - Denne egenskab er feltets ID.
      • value - Denne egenskab er værdien af feltet som en streng.
    • additionalValues - Denne egenskab er et objekt med nøgler og værdier defineret af afsnittet “Additional return values” i checkout-konfigurationen.
  • fields - Denne egenskab er et array af feltinput under den valgte forsendelsesmulighed. Hver post i arrayet er et objekt med disse egenskaber:
     
    • fieldId - Denne egenskab er feltets ID.
    • value - Denne egenskab er værdien af feltet som en streng.
  • totalPrice - Denne egenskab er den samlede pris for den valgte forsendelsesmulighed og eventuelle valgte tilvalg.

     
  • totalOriginalPrice - Denne egenskab er den samlede oprindelige pris for den valgte forsendelsesmulighed og eventuelle valgte tilvalg.

     
  • taxRate - Denne egenskab er momssatsen sat i checkout-konfigurationen.

     
  • additionalValues - Denne egenskab er et objekt med nøgler og værdier defineret af afsnittet “Additional return values” i checkout-konfigurationen.

     
  • resultsVersion - Denne egenskab er versionen af resultatobjektet. Den er i øjeblikket altid strengen "2".

     
  • widgetVersion - Denne egenskab er versionen af widgetten, der genererede resultatobjektet. Den er i øjeblikket altid strengen "2".

 

Gendan brugerens valg

I nogle tilfælde kan det være nødvendigt at gendanne de valg og indtastninger, som brugeren har foretaget i widgetten. For eksempel, hvis brugeren navigerer væk fra websiden, kan det aktuelle resultat fra widgetten gemmes i en form for vedvarende lager. Når brugeren så vender tilbage til websiden, kan det gemte resultat læses og anvendes på widgetten.

Der er to måder at gendanne et resultat til widgetten: Metoden setResult eller et andet valgfrit argument til updateOptions. Uanset hvilken metode der bruges, vil widgetten forsøge at vælge de samme muligheder, tilvalg, afhentningssteder eller tidsrum i resultatobjektet. Hvis nogen af elementerne mangler, vil det første rimelige element blive valgt i stedet.

 

  // Hvis widgetten er fyldt med forsendelsesmuligheder
  widget.setResult(result);
  
  // eller hvis nye muligheder skal anvendes sammen med et resultat
  widget.updateOptions(options, result);

 

Bemærk venligst, at det ikke er nødvendigt at give resultatargumentet til updateOptions-metoden, medmindre resultatet skal ændres. Widgetten vil holde styr på det aktuelle resultat internt og anvende det til de tilgængelige forsendelsesmuligheder.

 

 

Widget-instans

Widget-instansen, der returneres fra nShiftCheckoutWidget.createWidget(), har disse egenskaber og metoder:

{
   enabled: true,
   result: {},
   setResult(result),
   install(),
   uninstall(),
   enable(),
   disable(),
   updateOptions(options, result)
}
  • enabled - Dette er en egenskab, der indeholder widgettens aktiveret / deaktiveret status.

     
  • result - Dette er en egenskab, der indeholder det seneste widget-resultat. Se afsnittet Resultatobjektet for mere information.

     
  • setResult(result) - Denne metode tager et widget-resultat som argument og opdaterer widgetten for at afspejle de valg, der er foretaget i resultatet. Hovedformålet med dette er at gendanne brugerens valg, hvis websiden med widgetten genindlæses. Se afsnittet Resultatobjektet for mere information.

     
  • install() - Denne metode vil tilføje widgetten til websiden. HTML-elementer vil blive oprettet i container-elementet, når denne metode kaldes. Se Vis widgetten for mere information.

     
  • uninstall() - Denne metode vil fjerne widgetten fra websiden. Alle HTML DOM-elementer og eventlyttere, der er oprettet af widgetten, vil blive fjernet. Se Vis widgetten for mere information.

     
  • enable() - Denne metode aktiverer brugerinteraktion med widgetten. Se Fyld widgetten med forsendelsesmuligheder for mere information.

     
  • disable() - Denne metode deaktiverer brugerinteraktion med widgetten. Se Fyld widgetten med forsendelsesmuligheder for mere information.

     
  • updateOptions(options, results) - Denne metode opdaterer de forsendelsesmuligheder, der vises i widgetten. Den kan også opdatere brugerens valg samtidig, hvis det valgfrie results-argument gives. Se Fyld widgetten med forsendelsesmuligheder for mere information.

 

 

Relaterede artikler