Can't click add to cart when using required field

Yesterday @Shop_Lovers helped me make a custom field required using the following code in global.js

let input = document.querySelector("#username");
let button = document.querySelector(".product-form__submit");

button.disabled = true; 

input.addEventListener("change", stateHandle);

function stateHandle() {
    if (document.querySelector("#username").value === "") {
        button.disabled = true; 
    } else {
        button.disabled = false; 
    }
}

it works but when I’m on the product page and put something in the box it won’t let me click Add to cart unless I click somewhere outside of the custom field

https://followgator.com/products/100-tiktok-followers

how can I make it clickable after putting text in without clicking somewhere else first?

Hi @gators ,

Please change code here:

“change” => “input”

Hope it helps!