<p>You won't be able to collect all information and take payment using one form/action. The customer information is added to the cart using <code>commerce/cart/updateCart</code> and payment is processed using <code>commerce/payments/pay</code>.</p>

<p>To show the available shipping methods to a customer, Craft Commerce needs to know the shipping address to match against the rules you've set up. For this reason you'll need to split your checkout into separate forms.</p>

<p>I have built a "one-page" checkout with 'Customer Details', 'Delivery Method' and 'Payment' sections. Each section has a 'Continue' button that submits the information and updates the cart. Each section has the same redirection URL (<code>/checkout</code>) so the user lands back on the "one-page". </p>

<p>If you wanted to do away with 'Continue' buttons, you could use Javascript to submit the customer's information and receive a JSON response. This would include the available shipping methods and the cart totals which you'd use to update the page without the need for a refresh.</p>

CC BY-SA 3.0
2016-09-01T13:28:51.657Z
If we did not need to collect shipping information, or choose delivery methods, would that simplify things at all?
Adam Ladrach
CC BY-SA 3.0
2016-09-01T14:22:04.183Z
You wouldn't need to worry about the JSON response and updating shipping methods - but you'd still need to use two actions as you can't add customer info to the card using `commerce/payments/pay`.
Luke Pearce
CC BY-SA 4.0
2019-11-27T11:01:05.580Z
These guys have a one page checkout: https://www.oslodeco.no/kassen (made by vaersaagod.no)
nitech
CC BY-SA 4.0
2021-12-29T20:30:39.093Z
the overall documentation concerning checkout is abysmal. barely anything
Cat Named Dog
CC BY-SA 3.0
2016-09-01T07:58:19.153Z
2016-09-01T07:58:19.153Z
Luke Pearce
<p>Does anyone have any recommendation on how to reformat the Commerce checkout workflow to be on one page? More specifically, how to pass the address/customer info before the payment info without having to redirect to another page? I've tried combining them into one form without success.</p>

<p>Thanks!</p>

<plugin-craftcommerce>
One-Page Commerce Checkout
# One-Page Commerce Checkout

(Asked by: username_0 on 2016-08-31)

Does anyone have any recommendation on how to reformat the Commerce checkout workflow to be on one page? More specifically, how to pass the address/customer info before the payment info without having to redirect to another page? I've tried combining them into one form without success.

Thanks!

**Tags:** plugin-craftcommerce


---

## 1 answers

### Answer by username_1 on 2016-09-01. Score: 7 | Accepted answer

You won't be able to collect all information and take payment using one form/action. The customer information is added to the cart using `commerce/cart/updateCart` and payment is processed using `commerce/payments/pay`.

To show the available shipping methods to a customer, Craft Commerce needs to know the shipping address to match against the rules you've set up. For this reason you'll need to split your checkout into separate forms.

I have built a "one-page" checkout with 'Customer Details', 'Delivery Method' and 'Payment' sections. Each section has a 'Continue' button that submits the information and updates the cart. Each section has the same redirection URL (`/checkout`) so the user lands back on the "one-page".

If you wanted to do away with 'Continue' buttons, you could use Javascript to submit the customer's information and receive a JSON response. This would include the available shipping methods and the cart totals which you'd use to update the page without the need for a refresh.

> **Comments:**
> **username_0**: If we did not need to collect shipping information, or choose delivery methods, would that simplify things at all?  
> **username_1**: You wouldn't need to worry about the JSON response and updating shipping methods - but you'd still need to use two actions as you can't add customer info to the card using `commerce/payments/pay`.  
> **username_2**: These guys have a one page checkout: https://www.oslodeco.no/kassen (made by vaersaagod.no)  
> **username_3**: the overall documentation concerning checkout is abysmal. barely anything  

---

