Create Korean Card Number Element

createElement('krCardNumber', options?)

Use this function to create an instance of an individual Element.

Parameters

typerequired'krCardNumber'

The type of element you are creating.

optionsoptionalKrCardNumberElementOptions

Options for creating krCardNumber Element.

Returns

KrCardNumberElement | null
linkTypeScript
1import { createElement } from '@airwallex/components-sdk';
2const element = await createElement('krCardNumber');

KrCardNumberElementOptions

Applies to split card element type integration, the interface used when createElement() called with type krCardNumber

authorizationTypeoptional

The authorization type for the card payment. Set it to 'pre_auth' if you want to place a hold on your customer's card for more than 7 days, i.e., extend the authorization time window. Currently it's only available when the card brand is Visa or Mastercard. autoCapture will be automatically set to false if you enable 'pre_auth'. Default value is 'final_auth'.

autoCaptureoptionalboolean

Whether the amount should be captured automatically upon successful payment authorization. Set it to false if you want to place a hold on the payment method and capture the funds sometime later. Default value is true.

disabledoptionalboolean

Whether the krCardNumber Element input is disabled or not. Default value is false.

intentoptional

The Payment Intent you would like to checkout. Refer to Airwallex Client APIAPI

placeholderoptionalstring

A short hint to suggest the expected value of an input field to the shopper.

Style for the krCardNumber Element.

KrCardNumberElement

Functions and external fields can be used in your integration flow with Airwallex Payment Elements.

blur()

Using this function to blur the HTML Input element.

Returns

void
linkTypeScript
1element.blur();

clear()

Using this function to clear the HTML Input element.

Returns

void
linkTypeScript
1element.clear();

confirm(data)

Call this function when the shopper is ready to make a payment as per the details in the Payment Intent. Confirms the Payment Intent.

Returns

Promiselink<>
linkTypeScript
1element.confirm({
2 client_secret: 'replace-with-your-client-secret',
3});

destroy()

Destroys the Element instance.

Returns

void
linkTypeScript
1element.destroy();

focus()

Using this function to focus the HTML Input element

Returns

void
linkTypeScript
1element.focus();

mount(domElement)

Mounts Element to your HTML DOM.

Parameters

domElementrequiredstring | HTMLElement

Returns

null | HTMLElement
linkTypeScript
1// There are two ways to mount the element:
2// 1. Call with the container DOM id
3element.mount('container-dom-id');
4
5// 2. Find the created DOM in the existing HTML and call with the container DOM element
6const containerElement = document.getElementById('container-dom-id');
7element.mount(containerElement);

on(eventCode, handler)

Listen to Element events.

Parameters

eventCoderequiredEventCode

The event code to listen for.

The callback function that will be called when the event occurs.

Returns

void
linkTypeScript
1element.on('change', (e) => {
2 const { completed, empty, error } = e.detail;
3 // Handle change event
4});

unmount()

Unmounts the Element. Note that the Element instance will remain.

Returns

void
linkTypeScript
1element.unmount();

update(options?, initOptions?)

Call this function to update Element options after creating the Element.

Returns

void
linkTypeScript
1element.update({
2 autoCapture: false,
3});

Was this page helpful?