Streaming live at 10am (PST)

Use javascript to simulate a click on Ecommerce variant select option

I am trying to use checkboxes to select an option in an HTML select element. I have it NEARLY working and a working demo can be seen here - https://ecommerce-ds-addons.webflow.io/product/bag-addons-as-variants - if you tick the checkboxes marked “Cycling Clips” or “Red Safety Light” - you can see that the faded out select boxs above change.

However, the price should change and when the item is added to cart, these “Add-ons” should be included - but they are not. If you select the dropdowns manually using your mouse, you will see how it should work.

A simplified version of the javascript I am using is:

$("select :nth-child(2)").prop('selected', true).trigger('change');

Is there a way to simulate a click that will work in this instance?

I found this piece of code on another thread and it worked when a jquery trigger or click would not work. However, I 've tried this and it didn’t work either.

$(function() {
    $('a').click(function() {
        // 'this' is not a jQuery object, so it will use
        // the default click() function
        this.click();
    }).click();
});

Any help is greatly appreciated!


Previous thread with cloneable example - Choose variant with checkbox (Jquery)

Solved in this thread

1 Like