Magento Onepage Checkout, Quick But Not Dirty

The Magento Onepage Checkout is a very special feature in Magento. Beyond the regular Model-Controller-View structure, the Onepage MCV is quite a hybrid of PHP and JavaScript.

The first place to look is of course the Mage_Checkout_OnepageController, this is pretty much the bread and butter of many nice little tricks.

The index action together with the corresponding block and template file are indeed very important here.  Indeed, our first treat today lies in the block file (Checkout/Block/Onepage.php):

[codesyntax lang=”php” lines=”fancy”]

$stepCodes = array('billing', 'shipping', 'shipping_method', 'payment',  'review');

[/codesyntax]

This is the key place where we can easily remove one step from Onepage checkout (to add or to edit is much trickier though). For example if free shipping is the only method, we may want to choose this shipping method automatically and remove the shipping method step. In this case, we should simply remove ‘shipping_method’ from $stepCodes.

Of course, we don’t want to break the checkout logic, so we need to modify the controller to accommodate this step change.

Note that each action in the Onepage Controller has two key parts:

All computation behind the scene:

[codesyntax lang=”php” lines=”fancy”]

$data = $this->getRequest()->getPost('blablabla', array());
...
$result = $this->getOnepage()->saveBlablabla'($data);

[/codesyntax]

And then the presentation creating the view:

[codesyntax lang=”php” lines=”fancy”]

$result['goto_section'] = 'next_section';
$result['update_section'] = array(
        'name' => 'next_step_name',
        'html' => $this->_getXxxxxHtml(), //html template for the next  step
);

[/codesyntax]

In free shipping example, the $data part can be handled like this:

[codesyntax lang=”javascript” lines=”fancy”]

$result = $this->getOnepage()->saveShippingMethod('freeshipping_freeshipping');

[/codesyntax]

As for the other part, just make sure for both saveBillingAction() and saveShippingAction(), the $result jumps directly to the payment step:

[codesyntax lang=”php” lines=”fancy”]

$result['goto_section'] = 'payment';
$result['update_section'] = array(
        'name' => 'payment-method',
        'html' => $this->_getPaymentMethodsHtml()
);

[/codesyntax]

Here we reach the end of our quick tour around Magento Onepage Checkout. The take home message is you don’t always have to get your hands dirty with the Ajax part.