cancel
Showing results for 
Search instead for 
Did you mean: 

Hide Configurable Product Price until Option is Selected

Hide Configurable Product Price until Option is Selected

Is there a better way to hide the price of the configurable product on the product page but reveal the price once a selection is made?

 

jQuery( ".product-options .price" ).hide();
jQuery( ".super-attribute-select" ).change(function () {
if (jQuery( ".super-attribute-select" ).val() !== "Choose an Option..." ) {
jQuery( ".product-options .price" ).show();
}
else if (jQuery( ".super-attribute-select" ).val() == "Choose an Option..." ) {
jQuery( ".product-options .price" ).show();
}
});

 

Second, is there a way to hide the price again in case the "Choose an Option" selection is made once again? My else if statement doesnt seem to work correctly, as the $0.00 price remains visible if you reselect "Choose an Option".

eCommerce Development, Marketing Strategy & Creative Design (Magento Certified x2)
LinkedIn | Website | GitHub | Magento Certifications
4 REPLIES

Re: Hide Configurable Product Price until Option is Selected

@joshua34

 

Try with the Element Id or you need to make changes into the js file to fulfil your requirements.

Found something useful, please give "Kudos" or "Accept as Solution" for Token of Appreciation.
Free Magento Extensions : https://magecomp.com/free-magento-extensions.html

Re: Hide Configurable Product Price until Option is Selected

Has anyone made this work?

Re: Hide Configurable Product Price until Option is Selected

You can try it by

 

jQuery( ".wapper-view" ).show();
 jQuery( ".super-attribute-select" ).change(function () {
if (jQuery( ".super-attribute-select" ).val() == "" ) {
    jQuery( ".wapper-view" ).hide();
}else  {
    jQuery( ".wapper-view" ).show();
}
});

Re: Hide Configurable Product Price until Option is Selected

Some one make that work ?