Friday, May 29, 2015

Magento - Change options of configurable product to radio button

Replace the configurable.phtml code with below code:
<?php
$_product    = $this->getProduct();
$_attributes = Mage::helper('core')->decorateArray($this->getAllowAttributes());
?>
<?php if ($_product->isSaleable() && count($_attributes)):?>
    <dl>
    <?php foreach($_attributes as $_attribute): ?>
        <dt><label class="required"><em>*</em><?php echo $_attribute->getLabel() ?></label></dt>
        <dd<?php if ($_attribute->decoratedIsLast){?> class="last"<?php }?>>
            <div class="input-box">
                <select style="display:none;" name="super_attribute[<?php echo $_attribute->getAttributeId() ?>]" id="attribute<?php echo $_attribute->getAttributeId() ?>" class="required-entry super-attribute-select">
                   
                  </select>
              </div>
        </dd>
    <?php endforeach; ?>
    </dl>
    <script type="text/javascript">
        var spConfig = new Product.Config(<?php echo $this->getJsonConfig() ?>);
    </script>
<?php endif;?>
<div id="r"></div>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#attribute<?php echo $_attribute->getAttributeId() ?> option").each(function(i, e) {
    if(jQuery(this).val() == '')
    {}
    else
    {
    jQuery("<input type='radio' name='r' />")
        .attr("value", jQuery(this).val())
        .attr("checked", i == 0)
        .click(function () {
            jQuery("#attribute<?php echo $_attribute->getAttributeId() ?>").val(jQuery(this).val());
        })
        .appendTo("#r");
        jQuery("<span >&nbsp;&nbsp;&nbsp;"+jQuery(this).html()+"&nbsp;&nbsp;&nbsp;</span>")
        .appendTo("#r");
    }
       
});
});


</script>

No comments:

Post a Comment