Checkout Review

The checkout review enhancer reads stored checkout form data and renders it into the page so customers can review their information before completing an order. It auto-updates if the customer goes back and changes a field.

How It Works

1. The customer fills in checkout form fields on a previous step. The SDK stores the values in checkoutStore.
2. On the review page, mark a container with data-next-enhancer="checkout-review".
3. Inside the container, place elements with data-next-checkout-review="<field>". The enhancer fills them with the stored value.
4. If the customer goes back and updates a field, the review page picks up the change automatically — no JavaScript or page refresh required.

Quick Example

<div data-next-enhancer="checkout-review">
  <p>Email: <span data-next-checkout-review="email"></span></p>
  <p>Name: <span data-next-checkout-review="fname" data-next-format="name"></span></p>
  <p>
    Ship to:
    <address data-next-checkout-review="address1" data-next-format="address"></address>
  </p>
  <p>Phone: <span data-next-checkout-review="phone" data-next-format="phone"></span></p>
</div>

The container element is required. Review fields outside the container will not be populated.