Jump to content

Selected Attributes show titles


stephaNNb
 Share

Recommended Posts

Hello.

 

I got stuck on my project on my product page. 

I have 2 attributes colors and size, both gat title and can be selected.

I need to display the title or the name of the color and the name of a size in a separate div. near my button add to cart.  But i cannot find the right code to make this. 

 

Can somebody give me an advice? Or there is a plugin who can make my job easy ? 

 

Thank you.

Share this post


Link to post
Share on other sites

by default prestashop displays attributes above the add to cart button.

You want to move:

- color attribute

- size attribute

 

near to the add to cart button? Or you want to display there something else? can you shed some light on this please?

if you want to display only attribute name as a separate thing (not related to attributes selection), what if someone change attribute ? 

Share this post


Link to post
Share on other sites

If you need to display the color or size attributes title according to user selections, then you can use simple inline JS onchange() function.

e.g

<select name="color" id="attr_color" onchange="$('#myCustomDiv').text($(this).val());">
{* options *}
</select>

{* create new html element/block to display the selected value. 
   You should place this html element/block in appropriate location
   or you may use CSS.
*}
<div id="myCustomDiv"></div>

  • Like 1

Share this post


Link to post
Share on other sites

  • 1 month later...

 

If you need to display the color or size attributes title according to user selections, then you can use simple inline JS onchange() function.

e.g

<select name="color" id="attr_color" onchange="$('#myCustomDiv').text($(this).val());">
{* options *}
</select>

{* create new html element/block to display the selected value. 
   You should place this html element/block in appropriate location
   or you may use CSS.
*}
<div id="myCustomDiv"></div>

Hello, sorry to bump this topic, but could you provide a code example for the display element, and what to put in {* options *}? Thank you in advance;

Edited by venom2506 (see edit history)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More