Hiding Next Button Until Requirements Met Using Javascript

You need to add an event listener to check changes in dropdown:

Can you check below

Qualtrics.SurveyEngine.addOnload(function() {
    // Disable next button initially
    this.hideNextButton();

    var that = this; // Capture the context for use in event handlers
    var requiredLeftDropdownIDs = [
        "dropdown1_left", "dropdown2_left", 
        "dropdown3_left", "dropdown4_left", 
        "dropdown5_left", "dropdown6_left", 
        "dropdown7_left", "dropdown8_left", 
        "dropdown9_left", "dropdown10_left", 
        "dropdown11_left", "dropdown12_left", 
        "dropdown13_left", "dropdown14_left", 
        "dropdown15_left"
    ];

    function validateDropdowns() {
        var allValid = true;
        requiredLeftDropdownIDs.forEach(function(id) {
            var dropdown = document.getElementById(id);
            if (dropdown && dropdown.value === "") {
                allValid = false; // Mark as invalid if any dropdown is not properly selected
            }
        });

        if (allValid) {
            that.showNextButton(); // Show next button if all dropdowns are valid
        } else {
            that.hideNextButton(); // Hide next button otherwise
        }
    }

    // Attach an event listener to each dropdown
    requiredLeftDropdownIDs.forEach(function(id) {
        var dropdown = document.getElementById(id);
        if (dropdown) {
            dropdown.addEventListener("change", validateDropdowns);
        }
    });

    // Initial validation check in case dropdowns have preset values
    validateDropdowns();
});