Skip to main content
You can initialize the fields by calling the init() method. Once this method is called, the sdk will emit the initializing, initialized, and/or the init_error change events. 
window.confidoHostedFields.init(options: Options): Promise<void>;
You can call init() multiple times in the same context. Each call will trigger a new initializing, initalized, and/or init_error sequence. The fields will also be reloaded each time init() is called.

​
Example

Example initializing the hosted fields for a Payment session. 
async function initHostedFields() {
  const res = await getPaymentTokenFromMyBackend();

  const fieldStyles = {
    border: "none",
    color: "rgb(26, 32, 44)",
    "font-family":
      '-apple-system, "system-ui", "Segoe UI", Helvetica, Arial, sans-serif',
    "font-weight": 400,
    height: "38px",
    width: "100%",
    "font-size": "16px",
  };

  window.confidoHostedFields.init({
    paymentToken: res.paymentToken,
    activeForm: "card",
    fields: {
      accountNumber: {
        containerId: "account-number",
        style: fieldStyles,
      },
      accountHolderName: {
        containerId: "account-holder-name",
        style: fieldStyles,
      },
      routingNumber: {
        containerId: "routing-number",
        style: fieldStyles,
      },
      cardNumber: {
        containerId: "card-number",
        style: fieldStyles,
      },
      cardExpirationDate: {
        containerId: "card-exp",
        style: fieldStyles,
      },
      cardSecurityCode: {
        containerId: "card-cvv",
        style: fieldStyles,
      },
    },
  });
}

​
Method Params Object

​
paymentToken
string
Payment Token returned from a paymentSessionCreate mutation. Required when using a Payment Session type.
​
savePaymentMethodToken
string
Token returned from a createSavePaymentMethodToken mutation call. Required when using a Save Payment Method Session type.
​
activeForm
enum
required
The initial active form. This can be either card or ach. The active form determines which fields are loaded.
​
fields
object
required
Configuration for the hosted fields.
⌘I