None of these worked for me with IE – especially older versions are giving syntax and unexpected errors.

Also, this does not work if the customer tries to add the product to the cart from the main category screen – instead, he’s redirected to the product page where he’s asked to make a selection (even though the added JS has already done that).
Thanks!

// set the defaults to the first option
Event.observe(window, ‘load’, function() {
$$(’.product-options select’).each(function(element) {
element.selectedIndex = 1;
opConfig.reloadPrice();
});
});

Basically, loop through all select items in the product options container and set each one to the first option.

You might also need the line opConfig.reloadPrice() to update the price if the selected option has a price increment.

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 ); // event type,bubbling,cancelable
return !element.dispatchEvent(evt);
}
}

Event.observe(window, ‘load’, function() {
spConfig.settings[0].selectedIndex = 1;
obj = spConfig.settings[0]; // this grabs the first select item
Event.observe(obj,’change’,function(){});
fireEvent(obj,’change’); // this simulates selecting the first option, which triggers
spConfig.settings[1].selectedIndex = 1; // this selects the first option of the second attribute drop menu

});

This code can , of course, be made better. The second part assumes you have two attributes. It may throw an error if you only have one. It can be modified to be more flexible and account for any number of attributes.

this code runs in IE:

var spConfig = new Product.Config(getJsonConfig() ?>);
// set the defaults to the first option – marlon 121109
Event.observe(window, ‘load’, function() {
spConfig.settings[0].selectedIndex = 1;
spConfig.reloadPrice();
});

Regards

Thank you

Thanks for the feedback.

It appears to be selecting the first option in the dropdown fine. But if you have a dropdown for Color and one for Size it doesn’t select the size.

I also tried manually setting the selected index. I looked at the source code on the magento pages and at least for me the dropdowns have these ID’s.

document.getElementById(‘attribute497′).selectedIndex = 1;
document.getElementById(‘attribute496′).selectedIndex = 1;

I think maybe placing this javascript in another location to ensure it doesn’t fire until the DOM layer is fully loaded may help.

Thanks for your time. Have any ideas?