Pre-Qualification Tool
  • 24 Jul 2025
  • 3 Minutes to read
  • Dark
    Light

Pre-Qualification Tool

  • Dark
    Light

Article summary

⚠️ Note that the 'Pre-Qualification' tool is not available by default. Please contact your account manager to inquire about this feature and for any relevant configuration or modal customizations.

Overview
Through our pre-qualification tool, your customers can shop with confidence. They can quickly input a few details at the start of their shopping journey and instantly see a personalized outline of what they can spend.

Customers have 24 hours to decide to move ahead, and once they return there’s no need to refill out any information.

Usage
Insert an HTML node with the data-up-prequal attribute on the desired page, view the example below.

<div style="display: none" data-up-prequal>
   //HTML Markup for the merchant specific widget detailing Flex Pay and Prequalification
   //Clicking this widget will launch Flex Pay Prequalification Modal and application 
</div>


In order to increase visibility of this feature you can implement widgets/banners like the ones below.

image
📘 Important items to note
  1. Pre-qualification Tool widgets are only available on non-payment pages.
  2. The HTML node should be included in the DOM before you load and initialize the Flex Pay library; however, it will be hidden until it is ready to be displayed to your customers.

Next, load and initialize the Flex Pay Payments library (only if you haven’t done so already) on the current page as shown below, substituting they keys listed in the REPLACE comment and UP code as per requirements.

(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');

// initializing the library
function initPayMonthly() {
  window.console.log("Initializing Uplift Payments...");
  window.Uplift.Payments.init({
    // REPLACE: locale, currency, and channel values should be replaced
    locale: "en-US", // "en-CA", "fr-CA"
    currency: "USD", // "CAD"
    checkout: false,
    channel: "desktop"
  });
} 


Then, define the window.upReady function, it should contain your integration logic and it will be executed when up.js is loaded in the browser.

⚠️ Unlike all other nodes, such as pricing nodes and and the up-pay-monthly-container in checkout where our library (Payments.js) handles when a node shows and when it does not, the pre-qual node needs to be shown manually by the developer.

window.upReady = function() { 
    // Call initPayMonthly
    initPayMonthly(); 
    // Call Uplift.Payments.load
    window.Uplift.Payments.load(); 
    // Show the node that will trigger Uplift's Pre-qual modal
    document.querySelector("[data-up-prequal]").style.display = "block"
} 


📘 In case the page does not have from prices, the function can be executed without parameters: window.Uplift.Payments.load();.
If the page contains From Pricing Nodes, it is necessary to execute the function with the Order Object Information as parameter: window.Uplift.Payments.load(orderInfo);

Test if the Pre-Qualification Tool integration worked by clicking on the element with the data-up-prequal attribute, this should display a modal similar to the one shown below.

image
Please reach out to your account manager to configure the language in the modal to best fit your needs.

Once the user goes all the way through pre-qualification, they should end up on a page as follows.

image

Callback
Partners can add a callback to action off once the customer clicks on the button on the final page.
Inside window.Uplift.Payments.init, pass a function called onUserActionCallback.

// callback when the user is done
function onUserActionCallback(data) {
  window.console.log('onUserActionCallback: ', data);
}
// initializing the library
function initPayMonthly() {
  window.console.log("Initializing Uplift Payments...");
  window.Uplift.Payments.init({
    locale: "en-US",
    currency: "USD",
    checkout: false,
    channel: "desktop",
    onUserActionCallback
  });
} 


The data received by this callback will be {action: "continue-shopping"} to indicate the user has clicked the button on the final page of the tool.

Pre-qualification Outcome

Flex Pay is unable to provide any additional information regarding the outcome of the estimation due to the confidentiality of the information.


Was this article helpful?