How can I auto-select the first one that available?

[thaxpy]

As you can see when I select variant 30.5g, The size variant 6" of 30.5g should be auto select, isn't it? but it is not. (Dawn theme)

How can I fix this?

[ThePrimeWeb]

Hey @thaxpy,

Can you share the link to your store? Thanks!

[thaxpy]

https://my23k.com/products/square-cuban-bracelet?variant=47835631845680

[ThePrimeWeb · Accepted solution]

Hey @thaxpy,

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid".
Scroll to the end and above the tag "</body>" tag paste the following. Screenshot attached for reference.

<script>
document.addEventListener('DOMContentLoaded', function () {
    let weights = document.querySelectorAll('input[name="Weight"]');

    weights.forEach(function(value, index){
        value.addEventListener('click', function() {
            setTimeout(() =>{
                let size = document.querySelectorAll('input[name="Size"]:not(.disabled)');
                size[0].click();
                found = true;    
            },100);
        });
    });
});
</script>

Screenshot for reference.

[thaxpy]

It really works, thank you! 

[EdRaga]

Hello, thanks for the code but I want to tell you that it works in some versions of Dawn, but not in all, do you know how to solve it?