Dynamically adjust the payment amount

Last updated: August 6, 2025

You can dynamically adjust the payment amount based on changes during checkout. For example, if the customer applies a discount code or changes their shipping method.

Information

You can only modify the payment sheet amount for Apple Pay and Google Pay payments.

During checkout, some payment methods display their own payment sheet with the payment amount to the customer.

To modify the payment amount shown, call the update() method on your CheckoutWebComponents instance and specify a new amount:


1await checkout.update({
2  amount: 2500
3});

If you update the payment sheet amount, you must also add a handleSubmit callback to the initialization code for your Flow instance to handle the payment attempt.

The handleSubmit event enables you to submit a modified payment session.

Add the event to the initialization code for your Flow instance:


1// Flow initialization
2const flowComponent = checkout.create('flow', {
3    onCardBinChanged,
4    handleSubmit,
5});

Implement the event logic to provide the payment submission data to your server-side integration:


1const handleSubmit = async (self, submitData) => {
2    // Provide the `submitData` to your server-side integration
3    // for payment submission
4    const submitResponse = await performPaymentSubmission(submitData);
5
6    return submitResponse;
7};

Call the Submit a payment session endpoint and provide the payment session's ID as a path parameter.

In your request, provide the payment session data from the handleSubmit event in session_data. You can also modify any of the following fields:

3ds
amount
items
reference

post

https://api.checkout.com/payment-sessions/{id}/submit


1{
2  "session_data": "{SESSION_DATA_FROM_FLOW}",
3  "3ds": {
4    "enabled": true
5  }
6}


1{
2  "id": "pay_f2ws3hn4ijquzbytp3v5lsfxge",
3  "status": "Action Required",
4  "type": "card",
5  "action": {
6    "type": "3ds",
7    "url": "http://3ds2.checkout.com/interceptor/sid_y3oqhf46pyzuxjbcn2giaqnb44"
8  }
9}

You must provide the unmodified response to the handleSubmit event in the client-side integration. Flow handles any additional required actions.

You can obtain the payment response for both asynchronous and synchronous payments.

Dynamically adjust the payment amount

Modify the payment sheet amount
Client side

Information

Add the handleSubmit event
Client side

Submit the modified payment session
Server side

Request example

Response example

Handle the payment response
Client side

Modify the payment sheet amount Client side

Information

Add the handleSubmit event Client side

Submit the modified payment session Server side

Request example

Response example

Handle the payment response Client side

Modify the payment sheet amount
Client side

Add the handleSubmit event
Client side

Submit the modified payment session
Server side

Handle the payment response
Client side