This has probably been asked before but I can't seem to find it. Is there a way with javascript to clear or reset a configurable swatch selection?

  • what version of magento and can you please elaborate what you mean by "clear or reset a configurable swatch selection" – Steven J Jan 26 '18 at 22:59
  • @StevenJ We have Magento For example, if the customer selects red on a shirt we disable the sizes that are out of stock, however, if they select red and small but then switch to another color where that size isn't available I want to remove the size selection. Does that make sense? – Jim Jan 29 '18 at 12:44

I had a similar need and I found myself wanting to "reset" the swatches options that were selected. First you have to empty the following array:


Doing it is very simple I have used this method:


Having done this you have to remove the "selected" class from all the TAGs and obviously reset the option of the relative hidden selection above the UL list. to do this I used jquery:

jQuery("li.selected").each(function () {

                    //console.log("Rimuovo la classe selected da questo LI: " + jQuery(this).attr('id'));
                    //console.log("Svuoto anche la select del relativo attributo");


But now if you try to select a LI that was selected you will notice that you will not be able to do it. To solve I modified the swatches-product.js file slightly

around the line: 401


if (opt != attr._e._last.selectedOption) {


if ((opt != attr._e._last.selectedOption) || (!opt._e.li.hasClassName('selected'))) {

This is because I did not find a way to reset all: attr._e._last.selectedOption and then I opted to perform a second condition that verifies that the selected class is perhaps correctly present.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.