Zapper Code

Render a dynamic Zapper QR Code without any of the UI of the Payment Widget

Functions
constructor(target: string | Element, options: ZapperCodeOptions)
const zapperCode = new zapper.payments.ZapperCode(
    "body",
    {
        merchantId: 17212,
        siteId: 15076,
        amount: 1.06,
        size: 200
    }
)
update(options: ZapperCodeOptions)
Updates the existing on-page Zapper Code with options: amount, reference, etc.
...
zapperCode.update({
    amount: 20.50
})
...
ZapperCodeOptions
Field
Type
Description
merchantId
number
Zapper Merchant ID
siteId
number
Zapper Site ID
amount
number
Amount to be paid
reference
string
Merchant or application reference. This field can be used to account the payment on the merchant integration, e.g. Order number
size
number
Image size for the Zapper Code in pixels
on(event: string, handler: function)
...
zapperCode.on('payment', ({ status, paidAmount, zapperId, reference }) => {    
    console.log(`Received payment of ${paidAmount} with reference ${reference}!`)
})
...
event: "payment" 
Event that is triggered after a successful or declined payment by the user. The Handler is called with a single PaymentResult parameter:
Field
Type
Description
status
number
Status of the payment
paidAmount
number
Amount paid by the user
zapperId
string
Zapper's unique identifier for the transaction
reference
string
Merchant or application reference, specified in the ZapperCodeOptions
Payment Status
StatusId
Description
2
Payment was successful
5
Payment was declined
Other payment statuses are reserved for internal use

Payment Widget

Next - Web

Ecommerce Plugins

Last updated 1 year ago

Field	Type	Description
merchantId	number	Zapper Merchant ID
siteId	number	Zapper Site ID
amount	number	Amount to be paid
reference	string	Merchant or application reference. This field can be used to account the payment on the merchant integration, e.g. Order number
size	number	Image size for the Zapper Code in pixels

StatusId	Description
2	Payment was successful
5	Payment was declined