This is the common requirement now of most of the customer to give the option to the end user to add the configurable product to cart from list page directly. Recently I did it for one of my client .
The basic problem which we generally face while adding configurable product to cart is that it has option which need to be selected. In default magento it will rediect yuo to product page to select the option.
Below are the steps you need to follow to achieve this :
STEP 1: In the catalog/product/list.phtml we have to put the check if the product is configurable :
Put this code within foreach loop of the product collection in grid and list mode.Here $_product is the instance of the configurable product ..
[codesyntax lang=”php”]
<?php
$optiohtml = ”;
if ($_product->getTypeId() == ‘configurable’) {
$attValConfig = $_product->getTypeInstance()->getConfigurableAttributesAsArray();
if(sizeof($attValConfig)) {
foreach($attValConfig as $attValConfigSingle) {
$attr_code = $attValConfigSingle[‘attribute_code’]; // it will get you the attribute code
$attribute_id = $attValConfigSingle[‘attribute_id’]; // it will get you the attribute id
$optiohtml .= $attValConfigSingle[‘frontend_label’].”: “;
$optiohtml .= “<select name=’super_attribute[{$attValConfigSingle[‘attribute_id’]}]’ id=’attribute_{$attValConfigSingle[‘attribute_id’]}_{$_product->getId()}’>”;
foreach($attValConfigSingle[‘values’] as $attValConfigSingleVal) {
$optiohtml .= “<option value='{$attValConfigSingleVal[‘value_index’]}’>{$attValConfigSingleVal[‘label’]}</option>”;
}
$optiohtml .= “</select>”;
}
}
}
?>
[/codesyntax]
STEP 2: In the above code we have created the drop down options for the product. We can put option drop down within form .
[codesyntax lang=”php”]
<?php if ($_product->getTypeId() == ‘configurable’) { ?>
<form action=”<?php echo $this->helper(‘checkout/cart’)->getAddUrl($_product) ?>” method=”get” id= “<?php echo ‘product_addtocart_form’. $product->getId() ?>”>
<?php echo $optionhtml; ?>
</form>
<?php } ?>
[/codesyntax]
STEP 3 : Now to add the product to cart we have submit the form which will post the data with the selected option to cart page :
[codesyntax lang=”php”]
<?php if ($_product->getTypeId() == ‘configurable’) { ?>
<button type=”button” class=”button btn-cart” onclick=”$(<?php echo ‘product_addtocart_form’. $product->getId() ?>).submit();><span><span><?php echo $this->__(‘Add to cart’) ?></span></span>
<?php }else { ?>
<button type=”button” class=”button btn-cart” onclick=”setLocation(‘<?php echo $this->getAddToCartUrl($_product) ?>’)” ><span><span><?php echo $this->__(‘Add to cart’) ?></span></span>
<?php } ?>
[/codesyntax]