Selecting Default Option for Configurable Product in Magento

javascriptmagento-1.7magento-1.8

I have a website selling handsets. The flow of website is. There are two categories
1) Phone on plans
2) prepaid phones

Now what we have set is a configurable product having two drop down
1) Phone option: phone on plans and prepaid phones
2) Plans : It contains plans and recharge which are configured depending on option selected.

I used a javascript code as below to select default option ie "Phone on plan" when user browse from phone on plan category. The code is used is as below

 jQuery(document).ready(function () {
    //var phonedropdown = document.getElementById('attribute156');
    //var plandropdown = document.getElementById('attribute157');
    <?php if($category_name == "Prepaid Phones") :?>
        Event.observe(window, 'load', function() {
            setDefaultConfigOptions(2);
        }); 
        //plandropdown.disabled = false;
    <?php endif; ?>
    <?php if($category_name == "Phones On Plan"):?>
        Event.observe(window, 'load', function() {
            setDefaultConfigOptions(1);
        }); 
        //phonedropdown.value = "44";
        //plandropdown.disabled = false;
    <?php endif; ?>
}); 
var spConfigIndex = 0;
function fireEvent(element,event)
{
    if (document.createEventObject)
    {
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt);
    }
    else
    {
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true );
        return !element.dispatchEvent(evt);
    }
}

function setDefaultConfigOptions(index)
{
    if (spConfigIndex >= spConfig.settings.length)
    {
        return; // stop
    }
    spConfig.settings[spConfigIndex].selectedIndex = index;
    var obj = spConfig.settings[spConfigIndex];

    ++spConfigIndex;

    Event.observe(obj,'change',function(){});

    window.setTimeout("setDefaultConfigOptions()", 1); // Add a small delay before moving onto the next option
}
// THE CODE ENDS HERE

</script> 

The problem is it works fine in mozilla and firefox but its not working in IE browsers. I think the issue is of Event.observer() but i am not sure what's going wrong.

Can anyone please help me in this

Thanks

Best Answer

I can recommend you this extension. Among other features, it will add a new column in the simple products grid associated to a configurable product that allows you to set a default configuration.
This could save you the trouble of having a very custom and ugly javascript. easylife switcher

Related Topic