Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Page 1 of 2
Configurable product: select options with radiobutton
 
BoostMyShop
Sr. Member
 
Avatar
Total Posts:  155
Joined:  2008-06-11
France
 

Hello smile

i created configurable product: OK
I’d like to replace the drop down list with a list of radio button.
I had a look to the template and it seems that dropdownlist is filled with javascript.

How can i modify code to user radio button list instead of a drop down list ?

thanks in advance for ur answer

Olixelle

 
Magento Community Magento Community
Magento Community
Magento Community
 
VortexCommerce
Sr. Member
 
Avatar
Total Posts:  104
Joined:  2008-08-06
Harrogate, UK
 

Any luck with this?

-
Bruce

 
Magento Community Magento Community
Magento Community
Magento Community
 
aromal
Jr. Member
 
Total Posts:  5
Joined:  2009-07-01
 

Dont expect any reply from Magento support team.

 
Magento Community Magento Community
Magento Community
Magento Community
 
sherold
Jr. Member
 
Total Posts:  5
Joined:  2007-12-06
Hamburg
 

Anything new on this topic?

 
Magento Community Magento Community
Magento Community
Magento Community
 
timjukes
Jr. Member
 
Total Posts:  8
Joined:  2009-12-10
 

Was looking for this myself. Looks like the place to start would be in:

app/design/frontend/default/your_theme_name/template/catalog/product/view/type/options/configurable.phtml

I\’ll post here if I have any success playing with it!

 
Magento Community Magento Community
Magento Community
Magento Community
 
marcelo2304
Jr. Member
 
Total Posts:  3
Joined:  2010-03-16
 

Any luck with this?

I saw it at brandlivecommerce.com web page.

Tks,

Marcelo

 
Magento Community Magento Community
Magento Community
Magento Community
 
gatinho
Member
 
Total Posts:  54
Joined:  2010-02-25
 

Hi,

today I wanted to do the same thing. Quickly modifying some html code shouldn’t be a big deal-but I had to learn how wrong I was...A further chapter about my love-hate-relationship with magento…

So, in the beginning it is not very intuitive how all works together...The phtml contains just an option value ("Choose option")-the other values are loaded dynamically via JS.

I want to share my result obtained so far. I am neither a Magento-, nor a JS guru. So the code might not be the best, but I think it is straightforward and understandable. In particular, I am warning to use it in productive environments, as it may be quite buggy. But I am sure, it is a good starting point-further optimization and testing is welcome (I tested with FF, not sure how other browsers behave...).

Find the code in the attachment and make a diff with your base files in order to see what I have done. In configurable.phtml the div element works like a wrapper for the input element (has the function of the selection element in the base file). The JS was adapted accordingly, i.e. where option elements for a select element are used, we are using the child elements (input) of the div-wrapper.

Regards,
Gatinho

File Attachments
configurable.phtml  (File Size: 2KB - Downloads: 1557)
product.js  (File Size: 25KB - Downloads: 1324)
 
Magento Community Magento Community
Magento Community
Magento Community
 
wkleo722
Jr. Member
 
Total Posts:  2
Joined:  2010-04-30
 

I want to try your method here. Can you tell me where products.js is stored?

 
Magento Community Magento Community
Magento Community
Magento Community
 
wkleo722
Jr. Member
 
Total Posts:  2
Joined:  2010-04-30
 

I found it.  And this works great! Thanks

 
Magento Community Magento Community
Magento Community
Magento Community
 
vikshu
Member
 
Total Posts:  69
Joined:  2009-04-09
Noida
 

Hey,

Was looking for it, will check and let u know… Thanks in advance

Thanks
Vikrant

 
Magento Community Magento Community
Magento Community
Magento Community
 
grazzt
Sr. Member
 
Total Posts:  106
Joined:  2010-02-28
 

It shows options as a radio-button menu, but the price doesn’t change when selecting options with different pricing

 
Magento Community Magento Community
Magento Community
Magento Community
 
TSK
Jr. Member
 
Total Posts:  23
Joined:  2009-07-06
 

@gatinho :  Thank you for information. it working fine in FF and chrome but its not working in IE 8.

Thanks in advance..

 
Magento Community Magento Community
Magento Community
Magento Community
 
gatinho
Member
 
Total Posts:  54
Joined:  2010-02-25
 

Hi,

sorry for the late answer. Just perceived the comments in this thread today :/

I also observed problems with IE. Please find enclosed my current product.js. It continues to be “hacky” (ugly code)-improvements are welcome. I think the main problem was the removal of the binding of the event listener (l. 387). In my shop, I am extracting a hex color code when the attribute is of type “color”. In this case, I am rendering a div with this color as background and insert an image with a frame (and transparent canvas). You can/should remove this for your purposes. I recommend a diff between your current file and this one in order to see the changes.

Current issue(s) that I have observed:

- when using several attributes (e.g. color, size), you can put an item in your basket without selecting the second attribute. Currently I don’t have time to fix this issue. But would be great, if someone could solve it wink

Now will use the “notify-me” option in order to see the activity in this thread.

File Attachments
product.js  (File Size: 28KB - Downloads: 507)
 
Magento Community Magento Community
Magento Community
Magento Community
 
vitalpoint.nl
Jr. Member
 
Total Posts:  4
Joined:  2010-07-05
 

Perfect, this is just what i was looking for.
One thing though; do you think there is a way to have the first option in the list initially selected instead of having them all unselected?

Thanks for your contribution!

 
Magento Community Magento Community
Magento Community
Magento Community
 
vitalpoint.nl
Jr. Member
 
Total Posts:  4
Joined:  2010-07-05
 

There also seems to be a problem with IE7.. At least when running in vista.
I`m not able to select an option.

Anyone has a solution for that?

 
Magento Community Magento Community
Magento Community
Magento Community
 
gatinho
Member
 
Total Posts:  54
Joined:  2010-02-25
 

What’s going on? Wasn’t notified...So here the late reply…

vitalpoint.nl - 23 August 2010 08:29 AM

There also seems to be a problem with IE7.. At least when running in vista.
I`m not able to select an option.

Anyone has a solution for that?

No, can’t test this behaviour, but would be really cool if anyone is capable to fix.

Modified the code in this way, that the very first option is selected and if there are further attributes, the first of these ones. Requires testing! Would be cool, if the selected attributes are remembered, i.e. if sb. selects Color: black and Size: XL, Size XL is (re)selected when changing the color instead of resetting.

File Attachments
product.js  (File Size: 28KB - Downloads: 935)
configurable.phtml  (File Size: 2KB - Downloads: 1001)
 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top
Page 1 of 2