Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Sam Bell
Sam Bell
4,410 Points

Submitting a form when 1 radio button from each fieldset has been checke

I am trying to submit a form only when all text inputs have been filled and 1 radio buttons from each fieldset has been checked. Here is my js code below, at the moment its looking for ALL radio buttons to be checked in order to submit the form but this is not what I want it to do and I am not sure how to target just 1 radio button from each fieldset. I have 4 fieldsets each containing 3-5 radio buttons in each. I only need 1 of these from each fieldset to be checked in order to submit the form.

// submit button var buttonEl = document.querySelector('.submit');

// if inputs are filled, the disabled button changes to enabled
formCheck = function(event, target){

    window.setTimeout(function(){

        // registration process
        var process = tcdom.getParent(target, '.process');
        var canSubmit = true;

        var optionEls = process.querySelectorAll('.input');

        // if all inputs have been checked or have a value enable submit button
        for (i = 0; i < optionEls.length; i++){

            if (!optionEls[i].querySelector('input:checked') && !optionEls[i].querySelector('input[type=text]')){
                canSubmit = false;
            }    
        }

        console.log('Can submit', canSubmit);

        // enabling submit button
        buttonEl.disabled = !canSubmit; 

    }, 100);

};

1 Answer

Steven Parker
Steven Parker
229,744 Points

You won't be able to make this determination by examining the elements individually, since you know that most radio buttons will not be checked.

Instead, you'll need to examine each button group together, and disqualify the submit only when all of them in a particular group are not checked.

You might make use of "getElementsByName" to loop through all of the associated buttons of each group.