Paddle.Checkout.close()

Use Paddle.Checkout.close() to close an opened checkout.

Typically used when working with overlay checkout to close the Paddle Checkout overlay. If used with inline checkout, removes the Paddle Checkout iframe from the DOM.

For success workflows, you can redirect to a success URL or pass an eventCallback to Paddle.Initialize() for checkout.completed. See Handle checkout success.

Example

This example shows how you can use Paddle.Checkout.close() to close an inline checkout.

HTML

<!-- Checkout buttons -->
<button onclick="openCheckout()">Open checkout</button>
<button onclick="closeCheckout()">Close checkout</button>

<!-- Inline checkout container -->
<div class="checkout-container"></div>

<script type="text/javascript">
  Paddle.Initialize({
    token: "live_7d279f61a3499fed520f7cd8c08",
  });

  function openCheckout() {
    var items = [
      {
        priceId: "pri_01gsz8x8sawmvhz1pv30nge1ke",
        quantity: 10,
      },
      {
        priceId: "pri_01gsz95g2zrkagg294kpstx54r",
        quantity: 1,
      },
      {
        priceId: "pri_01gsz98e27ak2tyhexptwc58yk",
        quantity: 1,
      },
    ];

    var settings = {
      displayMode: "inline",
      theme: "light",
      locale: "en",
      frameTarget: "checkout-container",
      frameStyle: "min-width: 600px;",
      frameInitialHeight: "450",
    };

    // Open checkout
    Paddle.Checkout.open({
      settings: settings,
      items: items,
    });
  }

  // Close checkout
  function closeCheckout() {
    Paddle.Checkout.close();
  }
</script>

TypeScript

import { initializePaddle } from "@paddle/paddle-js";

const paddle = await initializePaddle({
  token: "live_7d279f61a3499fed520f7cd8c08",
});

paddle?.Checkout.close();

Paddle.Checkout.close()

Example

Events

Was this page helpful?