attachToForm()

The attachToForm( ) function replaces the selected card fields with the corresponding proxy fields, which are hosted by MasterCard Payment Gateway and rendered within an iFrame. The proxy fields will have the same look and feel as the replaced fields.

Usage

PaymentSession.attachToForm(configuration, attachToFormCallback)

Example

// ATTACH HOSTED FIELDS TO YOUR PAYMENT PAGE
PaymentSession.attachToForm({
fields: {
    cardNumber: "#card-number",
    securityCode: "#security-code",
    expiryMonth: "#expiry-month",
    expiryYear: "#expiry-year"
},
frameEmbeddingMitigation: ["javascript", "x-frame-options", "csp"]
}, function (response) {
    // HANDLE RESPONSE FROM ATTACH TO FORM
    if ("ok" == response) {
        console.log("Session created or validated.");
        // SET THE FOCUS STYLE ON A FIELD AND SET ITS FOCUS
        PaymentSession.setFocusStyle(["cardNumber"], {backgroundColor: 'green'});
        PaymentSession.setFocus("cardNumber");
    } else {
        console.log("Failed to create or validate session:" + response);
    }
})

Arguments

configuration Object COMPULSORY

The object parameter to specify the configuration for the hosted fields rendered in an iFrame.

Fields:

session String

The unique identifier for the session. If you do not provide a sessionID the client library creates one.

fields Object COMPULSORY

Fields

cardNumber String COMPULSORY

A selector for the card number field.

securityCode String COMPULSORY

A selector for the security code field.

expiryMonth String COMPULSORY

A selector for the expiry month field.

expiryYear String COMPULSORY

A selector for the expiry year field.

frameEmbeddingMitigation String COMPULSORY

Specifies the mitigation option(s) for clickjacking prevention. For more information, see Best Practices.

Example

{
    session : "<sessionId>", // if not provided one is created
    fields : { // mandatory for all 4 fields
        cardNumber: "#card-number",
        securityCode: "#cvv",
        expiryMonth: "#expiry-month",
        expiryYear: "#expiry-year"
    },
    frameEmbeddingMitigation: ["javascript", "x-frame-options", "csp"]  // mandatory, can be a combination of any of these values
},

attachToFormCallback Function COMPULSORY

The function to handle the response from the HostedSession.attachToForm( ) call. Defined as attachToFormCallback = function(attachToFormResponse)

Fields:

status String

The overall status of the HostedSession.attachToForm( ) request.

Example

"ok" // string value of "ok" returned if successful else the error message

Return Value

None