Path Parameter Implementation

Overview

Path parameter is a Flex Pay attribute that allows the integration to identify if the implementation is running through different website paths using the same UP-code.

In order to provide more detailed reporting on the booking types to the partner, Flex Pay needs a way to recognize the exact flow on which the user selects Flex Pay as a payment method.

Implementation

Implementation is simple. During Uplift PaymentsJS initialization, the partner needs to add an extra attribute (path) in the initialization object passed in the Uplift.Payments.init() method.

⚠️ Important

Define with your account manager the path parameter values that better match your needs.

Example

For the below particular example, we identified 3 possible flows: Main, Final Payment, and Courtesy Hold to indicate the booking flow mapped below:

Booking/User Definition	Path Parameter Value	Business Definition
Main - new booking	main	Net New Booking
Final Payment - booking has existing funds	final-pay	Existing Booking
Courtesy Hold - booking does not have any existing funds (Guest returns from Courtesy Hold)	courtesy-hold	Net New Booking

📘 Add the path parameter in all the places where Uplift is initialized with the defiened values for both Payment Page and Non-Payment Pages

Payment Page Example

function initPayMonthly() {
  window.Uplift.Payments.init({
    // REPLACE: locale, currency, and channel values should be replaced
    locale: "en-US", // "en-CA", "fr-CA"
    currency: "USD", // "CAD"
    checkout: true,
    channel: "desktop",
    container: "#up-pay-monthly-container",
    onChange: myOnChangeCallback,
    /** ADD **/
    path: "courtesy-hold" // "main", "final-pay"  
  });
}

Non-Payment Page Example

function initPayMonthly() {
  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",
    /** ADD **/
    path: "courtesy-hold" // "main", "final-pay"
  });
}