Visa Installments
Visa Installments – Flexible Payments, Seamless Integration.
Empower your users with Visa Installments, a smart and flexible way to pay over time - now fully supported in the Mobile SDK starting from version 7.6.0.
Whether you're using our Ready-to-Use UI or building your own custom experience, integrating Visa Installments is straightforward and impactful.
Feature Highlights
- Frictionless User Experience: Eligible users can now choose an installment plan directly during checkout - no redirects, no extra steps.
- Dynamic Plan Fetching: Plans are retrieved in real-time via Visa’s API, ensuring up-to-date options.
- Terms & Conditions Acknowledgement: Users must confirm the T&Cs when selecting a plan, ensuring compliance and transparency.
- Configurable: Merchants can toggle the feature using the visaInstallmentConfig setting.
iOS
Android
Ready-to-Use UI
This feature is integrated into the existing card payment flow. The user simply enters the required card details and taps the Pay Now button—the rest is handled by the Mobile SDK.
Callback for getting selected plan
mSDK introduced new callback in OPPCheckoutProviderDelegate similar to existing one for continuing or aborting the transaction. The new callback will provide the additional details as well eg: in case of this installment plan flow Merchant will get the selected plan information in json string format.
- (void)checkoutProvider:(OPPCheckoutProvider *)checkoutProvider
continueSubmitting:(OPPTransaction *)transaction
andAddOnDetails:(OPPPaymentAddOnDetails * _Nullable)additionalDetails
completion:(void (^)(NSString * _Nullable checkoutID, BOOL abort))completion;
func checkoutProvider(_ checkoutProvider: OPPCheckoutProvider,
continueSubmitting transaction: OPPTransaction,
andAddOnDetails additionalDetails: OPPPaymentAddOnDetails?,
completion: @escaping (String?, Bool) -> Void)
This feature is integrated into the existing card payment flow. The user simply enters the required card details and taps the Pay Now button—the rest is handled by the Mobile SDK
Callback for getting selected plan
msdk provides you the selected visa installment plan in callback, before the payment is submitted. You will get more details about how to implement CALLBACK here.
You need to use OnBeforeSubmitCallback interface to listen to callbacks, consider below code snippet for reference
public class CheckoutOnBeforeSubmitListener implements OnBeforeSubmitCallback {
@Override
public void onBeforeSubmit(@NonNull PaymentDetails paymentDetails, @NonNull Listener callback) {
String selectedVisaPlanJson = paymentDetails.getSelectedVisaInstallmentPlan();
}
}class CheckoutOnBeforeSubmitListener : OnBeforeSubmitCallback {
override fun onBeforeSubmit(paymentDetails: PaymentDetails, callback: Listener) {
val selectedVisaPlanJson = paymentDetails.selectedVisaInstallmentPlan
}
}
SDK & Your Own UI
In this guide we assume that you have already implemented all steps for performing standard mSDK transaction.
In case of custom integration, merchant have to fetch the plans after having the checkout ID. Mobile SDK have introduced new API in the OPPPaymentProvider to fetch the installment plans for the card number.
1. Create an instance of OPPInstallmentPlanParams.
NSError *error;
OPPInstallmentPlanParams *params = [[OPPInstallmentPlanParams alloc] initWithCheckoutID:@"Checkout_Session_Id"
paymentBrand:@"Payment Brand"
cardNumber:@"Card Number"
expiryMonth:@"Expiry Month"
expiryYear:@"Expiry Year"
holder:@"Card_holder"
cvv:@"CVV"
error:&error];
let planParams = try? OPPInstallmentPlanParams(checkoutID: "Checkout_Session_Id",
paymentBrand: "Payment Brand",
cardNumber: "Card Number",
expiryMonth: "Expiry Month",
expiryYear: "Expiry Year",
holder: "Card_holder",
cvv: "CVV")
2. Call the API on payment provider to fetch the installment plans.
- (void)getVisaInstallmentPlans:(nonnull OPPInstallmentPlanParams *)planParams
completionHandler:(void (^)(OPPInstallmentPlanResponse * _Nullable response,
NSError * _Nullable error))completionHandler;
@objc public func getVisaInstallmentPlans(_ planParams: OPPInstallmentPlanParams,
completionHandler: @escaping (OPPInstallmentPlanResponse?,
(any Error)?) -> Void)
3. Submit transaction with selected installment plan.
There are three parameters we need to add as follows:
- installmentTxId - This is the installment plan transaction id. You can find in the response of the API while getting the installment plans.
- customParameters[vPlanID] - Specific to selected installment plan.
- customParameters[acceptedTAndCVersion] - Every installment plan have separate terms and conditions so you can parse the terms data and get the version.
You can use the below API to add this additional parameters on payment params.
OPPTransaction *transaction = [OPPTransaction transactionWithPaymentParams:params];
[transaction.paymentParams addParamWithName:@"installmentTxId" value:@"Value"];
[transaction.paymentParams addParamWithName:@"customParameters[vPlanID]" value:@"Value"];
[transaction.paymentParams addParamWithName:@"customParameters[acceptedTAndCVersion]" value:@"Value"];
OPPPaymentProvider *provider = [OPPPaymentProvider paymentProviderWithMode:providerMode];
[provider submitTransaction:transaction completionHandler:^(OPPTransaction * _Nonnull transaction, NSError * _Nullable error) {
// Get payment status
}];
let transaction = OPPTransaction(paymentParams: params)
transaction?.paymentParams.addParam(withName: "installmentTxId", value: "Value")
transaction?.paymentParams.addParam(withName: "customParameters[vPlanID]", value: "Value")
transaction?.paymentParams.addParam(withName: "customParameters[acceptedTAndCVersion]", value: "Value")
let provider = OPPPaymentProvider(mode: providerMode)
provider.submitTransaction(transaction, completionHandler: {(transaction, error) in
// Get payment status
})
In this guide we assume that you have already implemented all steps for performing standard mSDK transaction.
In case of custom integration, merchant have to fetch the plans after having the checkout ID. Mobile SDK have introduced new API in the OppPaymentProvider to fetch the installment plans for the card number.
1. Create an instance of InstallmentPlansParams
We need to create an instance of InstallmentPlansParams, which will be used to call API to fetch visa installment plans
InstallmentPlansParams planParams = new InstallmentPlansParams(checkoutId,
"payment brand", // eg VISA
"270", // cvv
"4051460126822028", // card number
"12", // expiry month
"2027", // expiry year
"John Doe"); // card holder name
planParams.setShopperResultUrl(CheckoutHelper.getShopperResultUrl());
val planParams = InstallmentPlansParams(
checkoutId,
"payment brand", // eg VISA
"270", // cvv
"4051460126822028", // card number
"12", // expiry month
"2027", // expiry year
"John Doe" // card holder name
)
planParams.shopperResultUrl = CheckoutHelper.getShopperResultUrl()
2. Call the API on payment provider to fetch the installment plans.
paymentProvider.requestVisaInstallmentPlans(planParams, (response, error) -> {
response.getInstallmentOffers();
});
paymentProvider.requestVisaInstallmentPlans(planParams) { response, error ->
response?.installmentOffers
}
3. Submit transaction with selected installment plan.
Below are the three parameters which you will receive in the response of requestVisaInstallmentPlans() API
- installmentTxId - This is the installment plan transaction id, you .
- customParameters[vPlanID] - Specific to selected installment plan.
- customParameters[acceptedTAndCVersion] - Every installment plan have separate terms and conditions so you can parse the terms data and get the version.
You can use the below API to add this additional parameters on payment params.
CardPaymentParams params = new CardPaymentParams(
checkoutId,
"VISA",
"4051 4601 2682 2028",
"Jon Doe",
"12",
"2027",
"270",
selectedVisaPlan.getvPlanID(), // vPlanID
String.valueOf(selectedVisaPlan.getTermsAndConditions().get(0).getVersion()), // acceptedTAndCVersion
response.getId() // installmentTxId
);
params.setShopperResultUrl("your shopper result url");
paymentProvider.submitTransaction(new Transaction(params),YourActivity.this);
val params = CardPaymentParams(
checkoutId,
"VISA",
"4051 4601 2682 2028",
"Jon Doe",
"12",
"2027",
"270",
selectedVisaPlan.vPlanID, // vPlanID
selectedVisaPlan.termsAndConditions[0].version.toString(), // acceptedTAndCVersion
response.id // installmentTxId
)
params.shopperResultUrl = CheckoutHelper.getShopperResultUrl()
paymentProvider.submitTransaction(Transaction(params),this@YourActivity)