[SapMan]

Hi all,
Is it possible to hide/unhide a product add-on when a different add-on has been selected?
Thanks.

[Althemist]

Hello SapMan,

I am afraid that would not be possible. The addons can not be displayed conditionally. They are available on per product basis or category based.

[SapMan]

With a bit of research I found a simple JS which makes it possible to hide/show a section based on if the checkbox is selected or not. I was able to hide the specific section by default, with the following css code:

div.product-addon:nth-child(7) {
 display: none;
}

But I’m not able connect the code to the specific checkbox.

Can you help me make it possible?

Thanks in advanced.

[SapMan]

I’m trying to run the following custom code, but it is not working. I hope you can help me with it:

<script>
var checkbox = document.querySelector("input[name='addon-354-menu-5[]']");
var text = document.getElementsByClassName("div.product-addon:nth-child(7)");
checkbox.addEventListener('change', function() {
  if (this.checked) {
    text[0].style.display = "block";
  } else {
    text[0].style.display = "none";
  }
});
</script>
<style>	div.product-addon:nth-child(7) {display: none;} </style>
<?php } );

[Althemist]

This would not work, because the addons are dynamically loaded via AJAX call. As I already explained, what you need just just can’t be done and even if manage you hide/show some of the options dynamically, that would lead to errors in the cart/order data.

[Author]

Posts