Pre-Qualification Tool

📘 The Pre-Qualification tool is not available by default. Contact your Account Manager to enable this feature and discuss modal customizations.

Overview

The Pre-Qualification tool lets customers check their spending eligibility at the start of their shopping journey. With a few inputs, they instantly see a personalized outline of what they can afford — giving them confidence to explore higher-value options.

How It Works

There are two ways customers can access pre-qualification:

Entry Point	How It Works
Dedicated widget	Add a `data-up-prequal` element anywhere on the page. Clicking it launches the pre-qualification modal.

Dedicated Widget Integration

1. Add the HTML Node

Place a hidden element with the data-up-prequal attribute wherever you want the pre-qualification entry point. You control the widget design — banners, buttons, or cards that match your site.

<div style="display: none" data-up-prequal>
  <!-- Your widget markup: banner, button, card, etc. -->
</div>

📘 - The pre-qualification widget is only available on non-payment pages.

The HTML node must be in the DOM before you load and initialize the Flex Pay library. It will remain hidden until ready.

2. Load and Initialize

📘 If you already completed Step 1 and Step 2 for this page, skip ahead to Step 3 — the SDK is already loaded and initialized.

If this is a standalone page without Flex Pay yet, add the up.js script and define the initialization:

(function (u, p, l, i, f, t, o, b, j) { u['UpLiftPlatformObject'] = f; u[f] = u[f] || function () { (u[f].q = u[f].q || []).push(arguments) }, u[f].l = 1 * new Date(); b = p.createElement(l), j = p.getElementsByTagName(l)[0]; b.async = 1; b.src = i + '?upcode=' + t; j.parentNode.insertBefore(b, j); o = u.location.host.match(/[\w-]+\.\w{2,3}(:\d+)?$/); if (o) o = o[0]; u[f]('create', t, o) })(window, document, 'script', 'https://tag.uplift.com/external/up.js', 'up', 'UP-XXXXXXXX-XX');

function initPayMonthly() {
  window.Uplift.Payments.init({
    locale: "en-US",
    currency: "USD",
    checkout: false,
    channel: "desktop"
  });
}

3. Show the Widget in `upReady`

Unlike <up-from-pricing> components which manage their own visibility, the pre-qualification widget must be shown manually by the developer:

window.upReady = function() {
  initPayMonthly();
  window.Uplift.Payments.load();

  document.querySelector("[data-up-prequal]").style.display = "block";
}

📘 If the page also contains <up-from-pricing> components, pass the order data: window.Uplift.Payments.load(orderInfo). If the page only has the pre-qualification widget, call window.Uplift.Payments.load() without parameters.

4. Verify

Click the widget element. You should see the pre-qualification modal.

Contact your Account Manager to configure the language and messaging in the modal.

After completing pre-qualification, customers see a confirmation screen.

Callback

You can hook into the pre-qualification flow by passing an onUserActionCallback function during initialization:

function onUserActionCallback(data) {
  console.log('onUserActionCallback:', data);
}

function initPayMonthly() {
  window.Uplift.Payments.init({
    locale: "en-US",
    currency: "USD",
    checkout: false,
    channel: "desktop",
    onUserActionCallback
  });
}

The callback receives { action: "continue-shopping" } when the customer clicks the button on the final screen. Use this to redirect customers, update UI state, or track conversions.

📘 Flex Pay cannot share the outcome of the pre-qualification due to confidentiality requirements. The callback only confirms the user completed the flow.