Last updated

Make a payment instrument available for future use

This example describes how to create a payment instrument and make it available for future payments. This is useful when you need to process payments that have a future date. To access this functionality directly, use RebillyInstrument.setup(instrument).

1. Add the library mounting points to your website

For this example, this is the only the required mounting point.

  1. HTML
  2. CSS
<html>
  <body>
    <div id="app">
      <div class="form-wrapper">
        <section class="rebilly-instruments"></section>
      </div>
    </div>
  </body>
</html>

2. Change the transactionType to setup

By default transactionType is set to purchase, change this property to setup. You may provide any purchase data available to mount.

RebillyInstruments.mount({
  publishableKey: 'pk_sandbox_123',
  organizationId: 'org-123',
  websiteId: 'my-website-id',
  transactionType: 'setup',
  money: {
    amount: 0,
    currency: 'USD',
  },
});

3. Check the result of the setup transaction (optional)

Use RebillyInstruments.on() to access the setup-completed event and to capture the instrument and the transaction.

RebillyInstruments.on('setup-completed', (setup) => {
  // setup will contain instrument and transaction
  console.log('setup-completed', setup);
});