Click-To-Pay Objects Reference (Request)

For complete sample code please refer here

Available dictionary objects

iStatus

const iStatus = {
    success: 100,
    unsupported: -100,
    error: -200
}

Use: iStatus.success

c2pEnvironment

const c2pEnvironment = {
    sandbox: 0,
    production: 1
}

Use: c2pEnvironment.sandbox

c2pReviewAction

const c2pReviewAction = {
    pay: "PAY",
    continue: "CONTINUE"
}

Use: c2pReviewAction.pay

Request objects

ClickToPayRequest

The Main object that contains all the information necessary to communicate with Click-To-Pay API.

Name	Type	Required	Description
environment	c2pEnvironment	Yes	Can be either c2pEnvironment.sandbox or c2pEnvironment.production
externalClientId	String	Yes	ID assigned to your merchant by Click-To-Pay Registration
click2payContainer	String	Yes	ID of the main div that will host the Click-To-Pay experience
mainCssClass	String	No	Default: c2p-def To override default styling, use this field to provide the name of your own css class
displayWaitScreenAfterCheckout	Boolean	No	Default: true After checkout Click-To-Pay control will be automatically reloaded. This controls if “Wait“ screen is set during that operation
reviewAction	c2pReviewAction	No	Default: c2pReviewAction.pay Controls final Button caption consumer clicks to make the payment
onButtonLoaded	Function	No	A callback function to be called when Click-To-Pay button is loaded. Accepts an object of type CPButtonLoadedResult Please click here for the sample code
onPaymentPrefill	Function	Yes	A callback function that returns the final price and tax calculations. Please click here for the sample code
onPaymentValidate	Function	No	A callback function to be called before Payment is made. Usually used to make custom validations before the payment. Please click here for the sample code
onPaymentSuccess	Function	Yes	A callback function to be called when Click-To-Pay Payment is authorized for the completion of the transaction. This function accepts a parameter of ClickToPayResponse. Please click here for the sample code
onPaymentCancel	Function	No	A callback function to be called when user cancels. Please click here for the sample code
onPaymentError	Function	No	A callback function to be called when payment errors out. Please click here for the sample code

onCPButtonLoaded callback example

onCPButtonLoaded: function(resp) {
    if (!resp) return;
    if (resp.status === iStatus.success) {
        showHide("click2payContainer", true);
    } else if (resp.reason) {
        console.log(resp.reason);
    }
}

onPaymentPrefill callback example

onPaymentPrefill: function(){
  const result = {
    merchantRequestId: "Merchant defined request ID",
    currencyCode: "USD",
    description: "...corp Product",
    orderId: "Merchant defined order ID",
    promoCode: "Merchant defined promo code",
    subtotal: roundTo(getAmount(), 2),
    shippingHandling: "2.00",
    tax: "2.00",
    discount: "1.00",
    giftWrap: "2.00",
    misc: "1.00",
    setTotal:  function() {
        this.total = roundTo(
            roundToNumber(this.subtotal, 2)
            + roundToNumber(this.shippingHandling, 2)
            + roundToNumber(this.tax, 2)
            + roundToNumber(this.giftWrap, 2)
            + roundToNumber(this.misc, 2)
            - roundToNumber(this.discount, 2)
        , 2);
        delete this.setTotal;
        return this;
    }
  }.setTotal();
  return result;
}

onPaymentValidate callback example

onPaymentValidate: function () {
    return new Promise(function (resolve, reject) {
        try {
            //Do some validation here
            resolve(iStatus.success);
        } catch (err) {
            reject(err);
        }
    });
}

onPaymentSuccess callback example

onPaymentSuccess: async function(clickToPayResponse) {
    return new Promise((resolve, reject) => {
        try {
            const response = await this.authorize(clickToPayResponse);
            console.log(response);
            const resp = JSON.parse(response);
            if (!resp)
                throw "Invalid response: "+ response;
            if (resp.xError) {
                throw resp;
            }
            resolve(response);
        } catch (err) {
            console.error("paymentSuccess error.", JSON.stringify(err));
            reject(err);
        }
    });
}

onPaymentCancel callback example

onPaymentCancel: function (payload) {
    logError("Click-To-Pay Cancelled", payload);
    //Do some custom logic here
}

onPaymentError callback example

onPaymentCancel: function (payload) {
    logError("Click-To-Pay Error", payload);
    //Do some custom logic here
}

---

CPButtonLoadedResult Object

Name	Type	Description
status	iStatus	There are be 3 possible cases: Click-To-Pay Button loaded successfully: status = iStatus.success An error occurred while loading Click-To-Pay Button: status = iStatus.error
reason	String	If Click-To-Pay Button failed to load this field will be populated with the reason.

---