Logg på

nShift Help Center

nShift Checkout-widget brukerinteraksjon

Avatar
Malene Tidemann
Oppdatert

nshift-checkout-label.png

 

To forskjellige typer endringer kan påvirke widgeten: eksterne og interne. Begge må håndteres forskjellig av nettsiden.

Lær om:

 

Viktig merknad: nShift Checkout-widgeten kan ikke brukes med Delivery Checkout (gammel versjon). Les mer om den gamle widgeten her. 

 

Eksterne endringer

En ekstern endring skjer når parametere endres som kan påvirke hvilke fraktalternativer som vises i widgeten. Vanlige parametere kan være mottakerens postnummer eller totalprisen på varene som kjøpes. Det viktigste med disse parameterne er at de er eksterne for widgeten. Når noen av dem endres, bør nye data for fraktalternativer hentes fra serveren. Når dataene er tilgjengelige, bør widget-metoden updateOptions kalles for å vise de nye fraktalternativene. For å be om data om fraktalternativer, bruk koden fra Fyll widgeten med fraktalternativer-seksjonen.

 

 

Interne endringer

En intern endring skjer når brukeren samhandler med widgeten. Dette inkluderer hendelser som å velge et fraktalternativ eller skrive tekst i et inndatafelt. Når en endring skjer, vil resultCallback-funksjonen fra widgetSettings bli kalt med et resultatobjekt. Hvis egenskapen valid inne i resultatobjektet er true, kan informasjonen i resultatobjektet brukes til å opprette en forsendelse. Hvis valid er false, er informasjonen ufullstendig og mer brukerinteraksjon kreves. Informasjonen i resultatobjektet kan fortsatt brukes til å oppdatere nettsiden for å gjenspeile brukerens valg så langt. For eksempel for å oppdatere totalprisen basert på gjeldende valg i widgeten.


Vennligst merk at interne endringer ikke skal utløse en forespørsel om nye fraktalternativer. Informasjonen som er skrevet inn eller valgt av brukeren i widgeten vil ikke endre hvilke fraktalternativer som er tilgjengelige.

 

Resultatobjektet

Dette er strukturen til resultatobjektet. Det er tilgjengelig enten som resultat-argumentet i resultCallback eller fra result-egenskapen på widget-instansen.

 

{
   "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 egenskapen er sann hvis resultatet er gyldig og kan brukes til å opprette en forsendelse.

     
  • sessionId - Denne egenskapen er UUID-en til økten som ble brukt for å be om fraktalternativene. Den er nødvendig for å opprette en forsendelse.

     
  • checkoutId - Denne egenskapen er UUID-en til utsjekkingskonfigurasjonen som ble brukt til å generere fraktalternativene.
  • checkoutVersion - Denne egenskapen er versjonsnummeret til utsjekkingskonfigurasjonen som ble brukt til å generere fraktalternativene. Dette vil være det faktiske versjonsnummeret til utsjekkingskonfigurasjonen selv når økten ble opprettet ved å bruke den aktive utsjekkingskonfigurasjons-ID-en.

     
  • optionId - Denne egenskapen er UUID-en til fraktalternativet som er valgt i widgeten. Den er nødvendig for å opprette en forsendelse.

     
  • pickupPointId - Denne egenskapen er den transportørspesifikke ID-en til hentepunktet som er valgt i widgeten. Den er kun nødvendig hvis fraktalternativet bruker hentepunkter. Merk at formatet og lengden på ID-en er transportørspesifikk.

     
  • timeSlotId - Denne egenskapen er den transportørspesifikke ID-en til tidsluken som er valgt i widgeten. Den er kun nødvendig hvis fraktalternativet bruker tidsluker. Merk at formatet og lengden på ID-en er transportørspesifikk.

     
  • addons - Denne egenskapen er en matrise med tillegg valgt under det valgte fraktalternativet. Hver oppføring i matrisen er et objekt med disse egenskapene:
     
    • addonId - Denne egenskapen er ID-en til tillegget.
    • price - Denne egenskapen er prisen som er lagt til totalprisen fordi dette tillegget er valgt.
    • originalPrice - Denne egenskapen er den opprinnelige prisen som er lagt til total opprinnelig pris fordi dette tillegget er valgt.
    • fields - Denne egenskapen er en matrise av feltinndata under det valgte tillegget. Hver oppføring i matrisen er et objekt med disse egenskapene:
      • fieldId - Denne egenskapen er felt-ID-en.
      • value - Denne egenskapen er verdien til feltet som en streng.
    • additionalValues - Denne egenskapen er et objekt med nøkler og verdier definert av delen "Additional return values" i utsjekkingskonfigurasjonen.
  • fields - Denne egenskapen er en matrise av feltinndata under det valgte fraktalternativet. Hver oppføring i matrisen er et objekt med disse egenskapene:
     
    • fieldId - Denne egenskapen er felt-ID-en.
    • value - Denne egenskapen er verdien til feltet som en streng.
  • totalPrice - Denne egenskapen er totalprisen for det valgte fraktalternativet og eventuelle valgte tillegg.

     
  • totalOriginalPrice - Denne egenskapen er den totale opprinnelige prisen for det valgte fraktalternativet og eventuelle valgte tillegg.

     
  • taxRate - Denne egenskapen er skattesatsen satt i utsjekkingskonfigurasjonen.

     
  • additionalValues - Denne egenskapen er et objekt med nøkler og verdier definert av delen "Additional return values" i utsjekkingskonfigurasjonen.

     
  • resultsVersion - Denne egenskapen er versjonen til resultatobjektet. Den er for øyeblikket alltid strengen "2".

     
  • widgetVersion - Denne egenskapen er versjonen til widgeten som genererte resultatobjektet. Den er for øyeblikket alltid strengen "2".

 

Gjenopprett brukerens valg

I noen tilfeller kan det være nødvendig å gjenopprette valgene og inndataene som brukeren har gjort i widgeten. For eksempel, hvis brukeren navigerer bort fra nettsiden, kan det nåværende resultatet av widgeten lagres i en eller annen vedvarende lagring. Når brukeren deretter kommer tilbake til nettsiden, kan det lagrede resultatet leses og brukes på widgeten.

Det finnes to måter å gjenopprette et resultat til widgeten på: Metoden setResult eller et andre valgfritt argument til updateOptions. Uansett hvilken metode som brukes, vil widgeten forsøke å velge de samme alternativene, tilleggene, hentepunktene eller tidslukene i resultatobjektet. Hvis noen av elementene mangler, vil det første rimelige elementet bli valgt i stedet.

 

  // Hvis widgeten er fylt med fraktalternativer
  widget.setResult(result);
  
  // eller hvis nye alternativer skal brukes sammen med et resultat
  widget.updateOptions(options, result);

 

Vennligst merk at det ikke er nødvendig å gi resultat-argumentet til updateOptions-metoden med mindre resultatet skal endres. Widgeten vil holde styr på det nåværende resultatet internt og bruke det på tilgjengelige fraktalternativer.

 

 

Widget-instans

Widget-instansen som returneres fra nShiftCheckoutWidget.createWidget() har disse egenskapene og metodene:

{
   enabled: true,
   result: {},
   setResult(result),
   install(),
   uninstall(),
   enable(),
   disable(),
   updateOptions(options, result)
}
  • enabled - Dette er en egenskap som inneholder aktivert / deaktivert status for widgeten.

     
  • result - Dette er en egenskap som inneholder det siste widget-resultatet. Se Resultatobjektet-seksjonen for mer informasjon.

     
  • setResult(result) - Denne metoden tar et widget-resultat som argument og oppdaterer widgeten for å gjenspeile valgene gjort i resultatet. Hovedbruken for dette er å gjenopprette brukerens valg hvis nettsiden som inneholder widgeten lastes på nytt. Se Resultatobjektet-seksjonen for mer informasjon.

     
  • install() - Denne metoden vil legge til widgeten på nettsiden. HTML-elementer vil bli opprettet i beholder-elementet når denne metoden kalles. Se Vis widgeten for mer informasjon.

     
  • uninstall() - Denne metoden vil fjerne widgeten fra nettsiden. Eventuelle HTML DOM-elementer og hendelseslytter som er opprettet av widgeten vil bli fjernet. Se Vis widgeten for mer informasjon.

     
  • enable() - Denne metoden aktiverer brukerinteraksjon med widgeten. Se Fyll widgeten med fraktalternativer for mer informasjon.

     
  • disable() - Denne metoden deaktiverer brukerinteraksjon med widgeten. Se Fyll widgeten med fraktalternativer for mer informasjon.

     
  • updateOptions(options, results) - Denne metoden oppdaterer fraktalternativene som vises i widgeten. Den kan også oppdatere brukerens valg samtidig hvis det valgfrie results-argumentet gis. Se Fyll widgeten med fraktalternativer for mer informasjon.

 

 

Relaterte artikler